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>&lt;Coders/&gt;</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

edited Dec 8 '18 at 11:35

asked Nov 24 '18 at 4:35

Irgi Ahmad Maulana

1213

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

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>&lt;Coders/&gt;</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

edited Dec 8 '18 at 11:35

asked Nov 24 '18 at 4:35

Irgi Ahmad Maulana

1213

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

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>&lt;Coders/&gt;</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

edited Dec 8 '18 at 11:35

asked Nov 24 '18 at 4:35

Irgi Ahmad Maulana

1213

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>&lt;Coders/&gt;</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

edited Dec 8 '18 at 11:35

asked Nov 24 '18 at 4:35

Irgi Ahmad Maulana

1213

edited Dec 8 '18 at 11:35

asked Nov 24 '18 at 4:35

Irgi Ahmad Maulana

1213

edited Dec 8 '18 at 11:35

asked Nov 24 '18 at 4:35

Irgi Ahmad Maulana

1213

asked Nov 24 '18 at 4:35

Irgi Ahmad Maulana

1213

asked Nov 24 '18 at 4:35

Irgi Ahmad Maulana

1213

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

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 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

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

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
});

}
});

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

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

Name

Required, but never shown

0

active

oldest

votes

0

active

oldest

votes

draft saved

draft discarded

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.

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Post as a guest

Name

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Name

Required, but never shown

Name

Required, but never shown

This page is only for reference, If you need detailed information, please check here

搜尋此網誌

Btukfyl

Show modal content page2 in page1[CLOSE]

login.html

login.html

login.html

login.html

0

Your Answer

Post as a guest

0

0

Post as a guest

Popular posts from this blog

A CLEAN and SIMPLE way to add appendices to Table of Contents and bookmarks

Calculate evaluation metrics using cross_val_predict sklearn

Insert data from modal to MySQL (multiple modal on website)