Bootstrap modal not working after clicking buttonWhy don't self-closing script elements work?How do JavaScript closures work?How do I detect a click outside an element?Trigger a button click with JavaScript on the Enter key in a text box<button> vs. <input type=“button” />. Which to use?How does JavaScript .prototype work?How can I know which radio button is selected via jQuery?How to create an HTML button that acts like a link?How does data binding work in AngularJS?Cannot display HTML string

Would the USA be eligible to join the European Union?

Why aren't rainbows blurred-out into nothing after they are produced?

Dogfights in outer space

Big number puzzle

Causal Diagrams using Wolfram?

What would it take to get a message to another star?

Luggage Storage at Szechenyi Baths

Stephen King and steam/diesel/cyber-punk

How would armour (and combat) change if the fighter didn't need to actually wear it?

Escape Velocity - Won't the orbital path just become larger with higher initial velocity?

Scam? Phone call from "Department of Social Security" asking me to call back

Running code generated in realtime in JavaScript with eval()

Would Mirko Vosk, Mind Drinker trigger Waste Not?

How do I call a 6-digit Australian phone number with a US-based mobile phone?

Cases with long math equation

What is the farthest a camera can see?

Help, I cannot decide when to start the story

Shifting tenses in the middle of narration

A torrent of foreign terms

How do some PhD students get 10+ papers? Is that what I need for landing good faculty position?

Lípínguapua dopo Pêpê

"Table of Astronomy's" depiction of the solar system models

"Mouth-breathing" as slang for stupidity

Telephone number in spoken words



Bootstrap modal not working after clicking button


Why don't self-closing script elements work?How do JavaScript closures work?How do I detect a click outside an element?Trigger a button click with JavaScript on the Enter key in a text box<button> vs. <input type=“button” />. Which to use?How does JavaScript .prototype work?How can I know which radio button is selected via jQuery?How to create an HTML button that acts like a link?How does data binding work in AngularJS?Cannot display HTML string






.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty margin-bottom:0;








0















I had tried bootstrap modal and its button is not working. Please help out
Thank u



My code that is not working:



 <body>
<div class="quit_modal" tabindex="-1" role="dialog" data-toggle="modal" data-target="quit_model">
<div class="modal-dialog" id="delete-file-modal" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Modal title</h5>
<button type="button" class="btnClose" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
<div class="container-fluid">
<div class="row">
<div class="col-md-4 ml-2"></div>
<button type="button" class="btn btn-secondary"><a id="close" data-dismiss="modal" data-target="#quit_modal">Close</a></button>&nbsp;&nbsp;
<button type="button" class="btn btn-danger">Button</button>
</div>
</div>
</div>
</div>
</div>
</div>
<script src="js/jquery-3.3.1.min.js"></script>
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>
<script type="text/javascript">

$("quit_Modal").modal('show');

$('btnClose').trigger('click');

</script>

</body>


https://i.stack.imgur.com/bj16u.png










share|improve this question
























  • did you add bootstrap css?

    – Devsi Odedra
    Mar 27 at 10:55











  • add the JQuery part under (document).ready() function and provide right selector .quit_Modal

    – Aarif
    Mar 27 at 10:55











  • not added bootstrap

    – krishna priya prasannan
    Mar 27 at 11:10











  • tried jquery stil not working

    – krishna priya prasannan
    Mar 27 at 11:11

















0















I had tried bootstrap modal and its button is not working. Please help out
Thank u



My code that is not working:



 <body>
<div class="quit_modal" tabindex="-1" role="dialog" data-toggle="modal" data-target="quit_model">
<div class="modal-dialog" id="delete-file-modal" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Modal title</h5>
<button type="button" class="btnClose" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
<div class="container-fluid">
<div class="row">
<div class="col-md-4 ml-2"></div>
<button type="button" class="btn btn-secondary"><a id="close" data-dismiss="modal" data-target="#quit_modal">Close</a></button>&nbsp;&nbsp;
<button type="button" class="btn btn-danger">Button</button>
</div>
</div>
</div>
</div>
</div>
</div>
<script src="js/jquery-3.3.1.min.js"></script>
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>
<script type="text/javascript">

$("quit_Modal").modal('show');

$('btnClose').trigger('click');

</script>

</body>


https://i.stack.imgur.com/bj16u.png










share|improve this question
























  • did you add bootstrap css?

    – Devsi Odedra
    Mar 27 at 10:55











  • add the JQuery part under (document).ready() function and provide right selector .quit_Modal

    – Aarif
    Mar 27 at 10:55











  • not added bootstrap

    – krishna priya prasannan
    Mar 27 at 11:10











  • tried jquery stil not working

    – krishna priya prasannan
    Mar 27 at 11:11













0












0








0








I had tried bootstrap modal and its button is not working. Please help out
Thank u



My code that is not working:



 <body>
<div class="quit_modal" tabindex="-1" role="dialog" data-toggle="modal" data-target="quit_model">
<div class="modal-dialog" id="delete-file-modal" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Modal title</h5>
<button type="button" class="btnClose" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
<div class="container-fluid">
<div class="row">
<div class="col-md-4 ml-2"></div>
<button type="button" class="btn btn-secondary"><a id="close" data-dismiss="modal" data-target="#quit_modal">Close</a></button>&nbsp;&nbsp;
<button type="button" class="btn btn-danger">Button</button>
</div>
</div>
</div>
</div>
</div>
</div>
<script src="js/jquery-3.3.1.min.js"></script>
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>
<script type="text/javascript">

$("quit_Modal").modal('show');

$('btnClose').trigger('click');

</script>

</body>


https://i.stack.imgur.com/bj16u.png










share|improve this question














I had tried bootstrap modal and its button is not working. Please help out
Thank u



My code that is not working:



 <body>
<div class="quit_modal" tabindex="-1" role="dialog" data-toggle="modal" data-target="quit_model">
<div class="modal-dialog" id="delete-file-modal" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Modal title</h5>
<button type="button" class="btnClose" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
<div class="container-fluid">
<div class="row">
<div class="col-md-4 ml-2"></div>
<button type="button" class="btn btn-secondary"><a id="close" data-dismiss="modal" data-target="#quit_modal">Close</a></button>&nbsp;&nbsp;
<button type="button" class="btn btn-danger">Button</button>
</div>
</div>
</div>
</div>
</div>
</div>
<script src="js/jquery-3.3.1.min.js"></script>
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>
<script type="text/javascript">

$("quit_Modal").modal('show');

$('btnClose').trigger('click');

</script>

</body>


https://i.stack.imgur.com/bj16u.png







javascript html bootstrap-modal






share|improve this question













share|improve this question











share|improve this question




share|improve this question










asked Mar 27 at 10:53









krishna priya prasannankrishna priya prasannan

167 bronze badges




167 bronze badges















  • did you add bootstrap css?

    – Devsi Odedra
    Mar 27 at 10:55











  • add the JQuery part under (document).ready() function and provide right selector .quit_Modal

    – Aarif
    Mar 27 at 10:55











  • not added bootstrap

    – krishna priya prasannan
    Mar 27 at 11:10











  • tried jquery stil not working

    – krishna priya prasannan
    Mar 27 at 11:11

















  • did you add bootstrap css?

    – Devsi Odedra
    Mar 27 at 10:55











  • add the JQuery part under (document).ready() function and provide right selector .quit_Modal

    – Aarif
    Mar 27 at 10:55











  • not added bootstrap

    – krishna priya prasannan
    Mar 27 at 11:10











  • tried jquery stil not working

    – krishna priya prasannan
    Mar 27 at 11:11
















did you add bootstrap css?

– Devsi Odedra
Mar 27 at 10:55





did you add bootstrap css?

– Devsi Odedra
Mar 27 at 10:55













add the JQuery part under (document).ready() function and provide right selector .quit_Modal

– Aarif
Mar 27 at 10:55





add the JQuery part under (document).ready() function and provide right selector .quit_Modal

– Aarif
Mar 27 at 10:55













not added bootstrap

– krishna priya prasannan
Mar 27 at 11:10





not added bootstrap

– krishna priya prasannan
Mar 27 at 11:10













tried jquery stil not working

– krishna priya prasannan
Mar 27 at 11:11





tried jquery stil not working

– krishna priya prasannan
Mar 27 at 11:11












3 Answers
3






active

oldest

votes


















1














Your current selectors ( "quit_Modal" and 'btnClose') with no class . or identifier # signs will refer to tags, so the jQuery will search for tags with the name of <quit_Modal> and <btnClose> in your DOM.



You're missing the selectors sign (dot . and #):



$("#quit_Modal").modal('show');
$('.btnClose').trigger('click');


NOTE: The quit_Modal should be an id id="quit_Modal".






jQuery(document).ready(function(e) 
$("#quit_Modal").modal('show');

setTimeout(function()
$('.btnClose').trigger('click');
, 1000);
);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet" />
<div class="modal fade" id="quit_Modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
<h4 class="modal-title" id="myModalLabel">Modal title</h4>
</div>
<div class="modal-body">
...
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default btnClose" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-danger">Button</button>
</div>
</div>
</div>
</div>








share|improve this answer



























  • but after edit still its not working

    – krishna priya prasannan
    Mar 27 at 11:01






  • 1





    Check my updated sample.

    – Zakaria Acharki
    Mar 27 at 11:11











  • It works Thank u

    – krishna priya prasannan
    Mar 27 at 11:27


















0














Your selector is wrong.



Instead of:



$("quit_Modal").modal('show');
$('btnClose').trigger('click');


use this:



$(".quit_Modal").modal('show');
$('.btnClose').trigger('click');





share|improve this answer

























  • but after edit still its not working

    – krishna priya prasannan
    Mar 27 at 11:02











  • Try this link for all type of bootstrap modal and check it your modal: getbootstrap.com/docs/4.0/components/modal

    – lucky
    Mar 27 at 11:08











  • When I removed the button click to popup modal its started not working

    – krishna priya prasannan
    Mar 27 at 11:13


















0














$("quit_Modal").modal('show');

$('btnClose').trigger('click');


Both are class so first put dot(.) before it...



$(".quit_Modal").modal('show');

$('.btnClose').trigger('click');





share|improve this answer

























  • but after edit still its not working

    – krishna priya prasannan
    Mar 27 at 11:01













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


















StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f55375446%2fbootstrap-modal-not-working-after-clicking-button%23new-answer', 'question_page');

);

Post as a guest















Required, but never shown

























3 Answers
3






active

oldest

votes








3 Answers
3






active

oldest

votes









active

oldest

votes






active

oldest

votes









1














Your current selectors ( "quit_Modal" and 'btnClose') with no class . or identifier # signs will refer to tags, so the jQuery will search for tags with the name of <quit_Modal> and <btnClose> in your DOM.



You're missing the selectors sign (dot . and #):



$("#quit_Modal").modal('show');
$('.btnClose').trigger('click');


NOTE: The quit_Modal should be an id id="quit_Modal".






jQuery(document).ready(function(e) 
$("#quit_Modal").modal('show');

setTimeout(function()
$('.btnClose').trigger('click');
, 1000);
);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet" />
<div class="modal fade" id="quit_Modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
<h4 class="modal-title" id="myModalLabel">Modal title</h4>
</div>
<div class="modal-body">
...
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default btnClose" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-danger">Button</button>
</div>
</div>
</div>
</div>








share|improve this answer



























  • but after edit still its not working

    – krishna priya prasannan
    Mar 27 at 11:01






  • 1





    Check my updated sample.

    – Zakaria Acharki
    Mar 27 at 11:11











  • It works Thank u

    – krishna priya prasannan
    Mar 27 at 11:27















1














Your current selectors ( "quit_Modal" and 'btnClose') with no class . or identifier # signs will refer to tags, so the jQuery will search for tags with the name of <quit_Modal> and <btnClose> in your DOM.



You're missing the selectors sign (dot . and #):



$("#quit_Modal").modal('show');
$('.btnClose').trigger('click');


NOTE: The quit_Modal should be an id id="quit_Modal".






jQuery(document).ready(function(e) 
$("#quit_Modal").modal('show');

setTimeout(function()
$('.btnClose').trigger('click');
, 1000);
);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet" />
<div class="modal fade" id="quit_Modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
<h4 class="modal-title" id="myModalLabel">Modal title</h4>
</div>
<div class="modal-body">
...
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default btnClose" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-danger">Button</button>
</div>
</div>
</div>
</div>








share|improve this answer



























  • but after edit still its not working

    – krishna priya prasannan
    Mar 27 at 11:01






  • 1





    Check my updated sample.

    – Zakaria Acharki
    Mar 27 at 11:11











  • It works Thank u

    – krishna priya prasannan
    Mar 27 at 11:27













1












1








1







Your current selectors ( "quit_Modal" and 'btnClose') with no class . or identifier # signs will refer to tags, so the jQuery will search for tags with the name of <quit_Modal> and <btnClose> in your DOM.



You're missing the selectors sign (dot . and #):



$("#quit_Modal").modal('show');
$('.btnClose').trigger('click');


NOTE: The quit_Modal should be an id id="quit_Modal".






jQuery(document).ready(function(e) 
$("#quit_Modal").modal('show');

setTimeout(function()
$('.btnClose').trigger('click');
, 1000);
);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet" />
<div class="modal fade" id="quit_Modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
<h4 class="modal-title" id="myModalLabel">Modal title</h4>
</div>
<div class="modal-body">
...
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default btnClose" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-danger">Button</button>
</div>
</div>
</div>
</div>








share|improve this answer















Your current selectors ( "quit_Modal" and 'btnClose') with no class . or identifier # signs will refer to tags, so the jQuery will search for tags with the name of <quit_Modal> and <btnClose> in your DOM.



You're missing the selectors sign (dot . and #):



$("#quit_Modal").modal('show');
$('.btnClose').trigger('click');


NOTE: The quit_Modal should be an id id="quit_Modal".






jQuery(document).ready(function(e) 
$("#quit_Modal").modal('show');

setTimeout(function()
$('.btnClose').trigger('click');
, 1000);
);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet" />
<div class="modal fade" id="quit_Modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
<h4 class="modal-title" id="myModalLabel">Modal title</h4>
</div>
<div class="modal-body">
...
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default btnClose" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-danger">Button</button>
</div>
</div>
</div>
</div>








jQuery(document).ready(function(e) 
$("#quit_Modal").modal('show');

setTimeout(function()
$('.btnClose').trigger('click');
, 1000);
);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet" />
<div class="modal fade" id="quit_Modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
<h4 class="modal-title" id="myModalLabel">Modal title</h4>
</div>
<div class="modal-body">
...
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default btnClose" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-danger">Button</button>
</div>
</div>
</div>
</div>





jQuery(document).ready(function(e) 
$("#quit_Modal").modal('show');

setTimeout(function()
$('.btnClose').trigger('click');
, 1000);
);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet" />
<div class="modal fade" id="quit_Modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
<h4 class="modal-title" id="myModalLabel">Modal title</h4>
</div>
<div class="modal-body">
...
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default btnClose" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-danger">Button</button>
</div>
</div>
</div>
</div>






share|improve this answer














share|improve this answer



share|improve this answer








edited Mar 27 at 11:11

























answered Mar 27 at 10:55









Zakaria AcharkiZakaria Acharki

58.4k13 gold badges45 silver badges74 bronze badges




58.4k13 gold badges45 silver badges74 bronze badges















  • but after edit still its not working

    – krishna priya prasannan
    Mar 27 at 11:01






  • 1





    Check my updated sample.

    – Zakaria Acharki
    Mar 27 at 11:11











  • It works Thank u

    – krishna priya prasannan
    Mar 27 at 11:27

















  • but after edit still its not working

    – krishna priya prasannan
    Mar 27 at 11:01






  • 1





    Check my updated sample.

    – Zakaria Acharki
    Mar 27 at 11:11











  • It works Thank u

    – krishna priya prasannan
    Mar 27 at 11:27
















but after edit still its not working

– krishna priya prasannan
Mar 27 at 11:01





but after edit still its not working

– krishna priya prasannan
Mar 27 at 11:01




1




1





Check my updated sample.

– Zakaria Acharki
Mar 27 at 11:11





Check my updated sample.

– Zakaria Acharki
Mar 27 at 11:11













It works Thank u

– krishna priya prasannan
Mar 27 at 11:27





It works Thank u

– krishna priya prasannan
Mar 27 at 11:27













0














Your selector is wrong.



Instead of:



$("quit_Modal").modal('show');
$('btnClose').trigger('click');


use this:



$(".quit_Modal").modal('show');
$('.btnClose').trigger('click');





share|improve this answer

























  • but after edit still its not working

    – krishna priya prasannan
    Mar 27 at 11:02











  • Try this link for all type of bootstrap modal and check it your modal: getbootstrap.com/docs/4.0/components/modal

    – lucky
    Mar 27 at 11:08











  • When I removed the button click to popup modal its started not working

    – krishna priya prasannan
    Mar 27 at 11:13















0














Your selector is wrong.



Instead of:



$("quit_Modal").modal('show');
$('btnClose').trigger('click');


use this:



$(".quit_Modal").modal('show');
$('.btnClose').trigger('click');





share|improve this answer

























  • but after edit still its not working

    – krishna priya prasannan
    Mar 27 at 11:02











  • Try this link for all type of bootstrap modal and check it your modal: getbootstrap.com/docs/4.0/components/modal

    – lucky
    Mar 27 at 11:08











  • When I removed the button click to popup modal its started not working

    – krishna priya prasannan
    Mar 27 at 11:13













0












0








0







Your selector is wrong.



Instead of:



$("quit_Modal").modal('show');
$('btnClose').trigger('click');


use this:



$(".quit_Modal").modal('show');
$('.btnClose').trigger('click');





share|improve this answer













Your selector is wrong.



Instead of:



$("quit_Modal").modal('show');
$('btnClose').trigger('click');


use this:



$(".quit_Modal").modal('show');
$('.btnClose').trigger('click');






share|improve this answer












share|improve this answer



share|improve this answer










answered Mar 27 at 10:56









XanderXander

6571 gold badge6 silver badges19 bronze badges




6571 gold badge6 silver badges19 bronze badges















  • but after edit still its not working

    – krishna priya prasannan
    Mar 27 at 11:02











  • Try this link for all type of bootstrap modal and check it your modal: getbootstrap.com/docs/4.0/components/modal

    – lucky
    Mar 27 at 11:08











  • When I removed the button click to popup modal its started not working

    – krishna priya prasannan
    Mar 27 at 11:13

















  • but after edit still its not working

    – krishna priya prasannan
    Mar 27 at 11:02











  • Try this link for all type of bootstrap modal and check it your modal: getbootstrap.com/docs/4.0/components/modal

    – lucky
    Mar 27 at 11:08











  • When I removed the button click to popup modal its started not working

    – krishna priya prasannan
    Mar 27 at 11:13
















but after edit still its not working

– krishna priya prasannan
Mar 27 at 11:02





but after edit still its not working

– krishna priya prasannan
Mar 27 at 11:02













Try this link for all type of bootstrap modal and check it your modal: getbootstrap.com/docs/4.0/components/modal

– lucky
Mar 27 at 11:08





Try this link for all type of bootstrap modal and check it your modal: getbootstrap.com/docs/4.0/components/modal

– lucky
Mar 27 at 11:08













When I removed the button click to popup modal its started not working

– krishna priya prasannan
Mar 27 at 11:13





When I removed the button click to popup modal its started not working

– krishna priya prasannan
Mar 27 at 11:13











0














$("quit_Modal").modal('show');

$('btnClose').trigger('click');


Both are class so first put dot(.) before it...



$(".quit_Modal").modal('show');

$('.btnClose').trigger('click');





share|improve this answer

























  • but after edit still its not working

    – krishna priya prasannan
    Mar 27 at 11:01















0














$("quit_Modal").modal('show');

$('btnClose').trigger('click');


Both are class so first put dot(.) before it...



$(".quit_Modal").modal('show');

$('.btnClose').trigger('click');





share|improve this answer

























  • but after edit still its not working

    – krishna priya prasannan
    Mar 27 at 11:01













0












0








0







$("quit_Modal").modal('show');

$('btnClose').trigger('click');


Both are class so first put dot(.) before it...



$(".quit_Modal").modal('show');

$('.btnClose').trigger('click');





share|improve this answer













$("quit_Modal").modal('show');

$('btnClose').trigger('click');


Both are class so first put dot(.) before it...



$(".quit_Modal").modal('show');

$('.btnClose').trigger('click');






share|improve this answer












share|improve this answer



share|improve this answer










answered Mar 27 at 10:57









luckylucky

1121 gold badge3 silver badges16 bronze badges




1121 gold badge3 silver badges16 bronze badges















  • but after edit still its not working

    – krishna priya prasannan
    Mar 27 at 11:01

















  • but after edit still its not working

    – krishna priya prasannan
    Mar 27 at 11:01
















but after edit still its not working

– krishna priya prasannan
Mar 27 at 11:01





but after edit still its not working

– krishna priya prasannan
Mar 27 at 11:01

















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














StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f55375446%2fbootstrap-modal-not-working-after-clicking-button%23new-answer', 'question_page');

);

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







Popular posts from this blog

Kamusi Yaliyomo Aina za kamusi | Muundo wa kamusi | Faida za kamusi | Dhima ya picha katika kamusi | Marejeo | Tazama pia | Viungo vya nje | UrambazajiKuhusu kamusiGo-SwahiliWiki-KamusiKamusi ya Kiswahili na Kiingerezakuihariri na kuongeza habari

SQL error code 1064 with creating Laravel foreign keysForeign key constraints: When to use ON UPDATE and ON DELETEDropping column with foreign key Laravel error: General error: 1025 Error on renameLaravel SQL Can't create tableLaravel Migration foreign key errorLaravel php artisan migrate:refresh giving a syntax errorSQLSTATE[42S01]: Base table or view already exists or Base table or view already exists: 1050 Tableerror in migrating laravel file to xampp serverSyntax error or access violation: 1064:syntax to use near 'unsigned not null, modelName varchar(191) not null, title varchar(191) not nLaravel cannot create new table field in mysqlLaravel 5.7:Last migration creates table but is not registered in the migration table

은진 송씨 목차 역사 본관 분파 인물 조선 왕실과의 인척 관계 집성촌 항렬자 인구 같이 보기 각주 둘러보기 메뉴은진 송씨세종실록 149권, 지리지 충청도 공주목 은진현