Show modal content page2 in page1[CLOSE]
So i have a loginpage like this
login.html
<body class="login">
<section class="login-page">
<div class="login-page-left">
<div class="line-login-top"></div>
<p>"LIFE WITHOUT<br/> CODING<br/> IT'S LIKE<br/> LIFE<br/> WITHOUT EATING"</p>
<div class="line-login-bottom"></div>
</div>
<div class="login-page-right">
<form class="login-form">
<h2>Hi!</h2>
<div class="line-below-hi"></div>
<div class="input-element">
<div>
<input type="text" placeholder="username"/>
</div>
<div>
<input type="password" placeholder="password"/>
</div>
<div>
<input type="submit" value="login"/>
</div>
</div>
</form>
</div>
</section>
</body>
And i have index contain the navigation bar which navigate to login.html
<nav>
<div class="hamburger-icon" id="toggle-menu">
<img src="assets/images/menu.png"/>
</div>
<div class="nav-left">
<h2><Coders/></h2>
</div>
<ul id="menu">
<li><a href="index.html">Home</a></li>
<li><a href="discussion.html">Discussion</a></li>
<li><a href="group.html">Group</a></li>
<li><a href="#">About</a></li>
<li><a href="login.html">SignIn</a></li>
</ul>
</nav>
all i want is how to show modal who contain the login(different page) when SignIn clicked.
i know how to make the modal in same page, but in another page i don't have idea what i have to do
jquery html css modal-dialog
add a comment |
So i have a loginpage like this
login.html
<body class="login">
<section class="login-page">
<div class="login-page-left">
<div class="line-login-top"></div>
<p>"LIFE WITHOUT<br/> CODING<br/> IT'S LIKE<br/> LIFE<br/> WITHOUT EATING"</p>
<div class="line-login-bottom"></div>
</div>
<div class="login-page-right">
<form class="login-form">
<h2>Hi!</h2>
<div class="line-below-hi"></div>
<div class="input-element">
<div>
<input type="text" placeholder="username"/>
</div>
<div>
<input type="password" placeholder="password"/>
</div>
<div>
<input type="submit" value="login"/>
</div>
</div>
</form>
</div>
</section>
</body>
And i have index contain the navigation bar which navigate to login.html
<nav>
<div class="hamburger-icon" id="toggle-menu">
<img src="assets/images/menu.png"/>
</div>
<div class="nav-left">
<h2><Coders/></h2>
</div>
<ul id="menu">
<li><a href="index.html">Home</a></li>
<li><a href="discussion.html">Discussion</a></li>
<li><a href="group.html">Group</a></li>
<li><a href="#">About</a></li>
<li><a href="login.html">SignIn</a></li>
</ul>
</nav>
all i want is how to show modal who contain the login(different page) when SignIn clicked.
i know how to make the modal in same page, but in another page i don't have idea what i have to do
jquery html css modal-dialog
give your modal and id and Include the modal page in your other page and then get your modal using the modal Id
– Akhtar Munir
Nov 24 '18 at 4:46
can you show me how the jquery code work?
– Irgi Ahmad Maulana
Nov 24 '18 at 4:47
you can do something like thisvar modal = document.getElementById('myModal');
it's simple, but sorry i am on the way in a car. try a bit search and you can do it
– Akhtar Munir
Nov 24 '18 at 4:51
hmm, i think if that id in same page it will show, but this is at different html, are you sure that's work ?
– Irgi Ahmad Maulana
Nov 25 '18 at 7:31
add a comment |
So i have a loginpage like this
login.html
<body class="login">
<section class="login-page">
<div class="login-page-left">
<div class="line-login-top"></div>
<p>"LIFE WITHOUT<br/> CODING<br/> IT'S LIKE<br/> LIFE<br/> WITHOUT EATING"</p>
<div class="line-login-bottom"></div>
</div>
<div class="login-page-right">
<form class="login-form">
<h2>Hi!</h2>
<div class="line-below-hi"></div>
<div class="input-element">
<div>
<input type="text" placeholder="username"/>
</div>
<div>
<input type="password" placeholder="password"/>
</div>
<div>
<input type="submit" value="login"/>
</div>
</div>
</form>
</div>
</section>
</body>
And i have index contain the navigation bar which navigate to login.html
<nav>
<div class="hamburger-icon" id="toggle-menu">
<img src="assets/images/menu.png"/>
</div>
<div class="nav-left">
<h2><Coders/></h2>
</div>
<ul id="menu">
<li><a href="index.html">Home</a></li>
<li><a href="discussion.html">Discussion</a></li>
<li><a href="group.html">Group</a></li>
<li><a href="#">About</a></li>
<li><a href="login.html">SignIn</a></li>
</ul>
</nav>
all i want is how to show modal who contain the login(different page) when SignIn clicked.
i know how to make the modal in same page, but in another page i don't have idea what i have to do
jquery html css modal-dialog
So i have a loginpage like this
login.html
<body class="login">
<section class="login-page">
<div class="login-page-left">
<div class="line-login-top"></div>
<p>"LIFE WITHOUT<br/> CODING<br/> IT'S LIKE<br/> LIFE<br/> WITHOUT EATING"</p>
<div class="line-login-bottom"></div>
</div>
<div class="login-page-right">
<form class="login-form">
<h2>Hi!</h2>
<div class="line-below-hi"></div>
<div class="input-element">
<div>
<input type="text" placeholder="username"/>
</div>
<div>
<input type="password" placeholder="password"/>
</div>
<div>
<input type="submit" value="login"/>
</div>
</div>
</form>
</div>
</section>
</body>
And i have index contain the navigation bar which navigate to login.html
<nav>
<div class="hamburger-icon" id="toggle-menu">
<img src="assets/images/menu.png"/>
</div>
<div class="nav-left">
<h2><Coders/></h2>
</div>
<ul id="menu">
<li><a href="index.html">Home</a></li>
<li><a href="discussion.html">Discussion</a></li>
<li><a href="group.html">Group</a></li>
<li><a href="#">About</a></li>
<li><a href="login.html">SignIn</a></li>
</ul>
</nav>
all i want is how to show modal who contain the login(different page) when SignIn clicked.
i know how to make the modal in same page, but in another page i don't have idea what i have to do
jquery html css modal-dialog
jquery html css modal-dialog
edited Dec 8 '18 at 11:35
Irgi Ahmad Maulana
asked Nov 24 '18 at 4:35
Irgi Ahmad MaulanaIrgi Ahmad Maulana
813
813
give your modal and id and Include the modal page in your other page and then get your modal using the modal Id
– Akhtar Munir
Nov 24 '18 at 4:46
can you show me how the jquery code work?
– Irgi Ahmad Maulana
Nov 24 '18 at 4:47
you can do something like thisvar modal = document.getElementById('myModal');
it's simple, but sorry i am on the way in a car. try a bit search and you can do it
– Akhtar Munir
Nov 24 '18 at 4:51
hmm, i think if that id in same page it will show, but this is at different html, are you sure that's work ?
– Irgi Ahmad Maulana
Nov 25 '18 at 7:31
add a comment |
give your modal and id and Include the modal page in your other page and then get your modal using the modal Id
– Akhtar Munir
Nov 24 '18 at 4:46
can you show me how the jquery code work?
– Irgi Ahmad Maulana
Nov 24 '18 at 4:47
you can do something like thisvar modal = document.getElementById('myModal');
it's simple, but sorry i am on the way in a car. try a bit search and you can do it
– Akhtar Munir
Nov 24 '18 at 4:51
hmm, i think if that id in same page it will show, but this is at different html, are you sure that's work ?
– Irgi Ahmad Maulana
Nov 25 '18 at 7:31
give your modal and id and Include the modal page in your other page and then get your modal using the modal Id
– Akhtar Munir
Nov 24 '18 at 4:46
give your modal and id and Include the modal page in your other page and then get your modal using the modal Id
– Akhtar Munir
Nov 24 '18 at 4:46
can you show me how the jquery code work?
– Irgi Ahmad Maulana
Nov 24 '18 at 4:47
can you show me how the jquery code work?
– Irgi Ahmad Maulana
Nov 24 '18 at 4:47
you can do something like this
var modal = document.getElementById('myModal');
it's simple, but sorry i am on the way in a car. try a bit search and you can do it– Akhtar Munir
Nov 24 '18 at 4:51
you can do something like this
var modal = document.getElementById('myModal');
it's simple, but sorry i am on the way in a car. try a bit search and you can do it– Akhtar Munir
Nov 24 '18 at 4:51
hmm, i think if that id in same page it will show, but this is at different html, are you sure that's work ?
– Irgi Ahmad Maulana
Nov 25 '18 at 7:31
hmm, i think if that id in same page it will show, but this is at different html, are you sure that's work ?
– Irgi Ahmad Maulana
Nov 25 '18 at 7:31
add a comment |
0
active
oldest
votes
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53455161%2fshow-modal-content-page2-in-page1close%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
0
active
oldest
votes
0
active
oldest
votes
active
oldest
votes
active
oldest
votes
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53455161%2fshow-modal-content-page2-in-page1close%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
give your modal and id and Include the modal page in your other page and then get your modal using the modal Id
– Akhtar Munir
Nov 24 '18 at 4:46
can you show me how the jquery code work?
– Irgi Ahmad Maulana
Nov 24 '18 at 4:47
you can do something like this
var modal = document.getElementById('myModal');
it's simple, but sorry i am on the way in a car. try a bit search and you can do it– Akhtar Munir
Nov 24 '18 at 4:51
hmm, i think if that id in same page it will show, but this is at different html, are you sure that's work ?
– Irgi Ahmad Maulana
Nov 25 '18 at 7:31