Open bootstrap modal using Javascript in PHP

Question

I'm trying to open bootstrap modal after login failed, I used the following code:

if (mysqli_num_rows($query) != 0)
{
    // Login successfully
}
else
{ 
    //Login failed
    echo '<script type="text/javascript"> $("#LoginFailed").modal("show")</script>';
}

And I incloud jQuery 1.12.4 in HTML head

<script src="js/jquery-1.12.4.js"></script>

Nothing happen, The LoginFailed modal not showing up !!

I also trying the solution HERE but no luck.

Any help?

Do you include jquery? Can you show console tab in web browser? — Ryan Nghiem
– Ryan Nghiem, Commented Jun 10, 2019 at 10:50
Note that in the answer you linked, the modal code is wrapped in document.ready(). Have you tried this? — Someone
– Someone, Commented Jun 10, 2019 at 10:51

Lucas Henrique · Accepted Answer · 2021-02-11 17:09:07Z

2

See exemple

I tried to tailor the exemple to yours. NOTE: In JSFiddle it will not be accurate since it only runs js css and HTML

You need to use

jQuery(document).ready(function (e) {
    // Your Modal
}

edited Feb 11, 2021 at 17:09

answered Jun 10, 2019 at 11:33

Lucas Henrique

769 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Abdulsalam Elsharif Over a year ago

Thanks you so much, It's work but only if I put the PHP code in at the end of the page, And If the login information correct I used header('location:index.php') to redirect to the index .. So whereas the headers must be invoked before any output is made, It's not work .. any Idea ?

Lucas Henrique Over a year ago

If I understand correctly, you should check if the user is logged in or not at the beginning of the code. If it is, it redirects to the home page, otherwise to login page. This prevents you from loading what you do not need and should not for the user.

Abdulsalam Elsharif Over a year ago

Hemrique This is what I do, in the top of page I check if the user credential is correct or not, If correct I redirect it using header('location:index.php') if not I want to popup a modal with error message. The problem that If I but this code in the top of the page "before html head" the header work and the popup not, and vice versa !! Hope this clear.

Abdulsalam Elsharif Over a year ago

Thank you so much, I really appreciate your help, It's work now ... Thaaaank you.

kishan · Accepted Answer · 2019-06-10 11:39:07Z

0

you should include bootstrap.min.js file after jquery-1.12.4.js

answered Jun 10, 2019 at 11:39

kishan

163 bronze badges

Collectives™ on Stack Overflow

Open bootstrap modal using Javascript in PHP

2 Answers 2

4 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

4 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related