CODEWITHSUNDEEP
bootstrap-modal
Minakshi
Minakshi

Reputation: 63

how to close pop up modal window in the bootstrap

$('#modal-createUser').modal('show');

I am using this to pop up modal window for inserting record. How to close this automatically after user saves data. I tried this but it closes after just it opens.

$('#modal-createUser').modal('show');//goes to other component and perform insert opearation and comes back
$('#modal-createUser').modal('hide');

Upvotes: 1

Views: 160

Answers (4)

Jibanjyoti Mohanta
Jibanjyoti Mohanta

Reputation: 1

$("#btnSubmit" ).click(function(){
// write ajax/ web api call to save data.
/*you can add condition using response object in case you don't 
want to close it for any error/failure.*/
    $('#modal-createUser').modal('hide'); 
});

$("form").submit(function(){
    // write ajax/ web api call to save data.
    $('#modal-createUser').modal('hide');
});

Upvotes: 0

Hien Nguyen
Hien Nguyen

Reputation: 18973

First step you need install jquery and bootstrap by npm command.

Second you need add declare var $ : any; in component

And use can use $('#modal-createUser').modal('hide');

Demo https://stackblitz.com/edit/angular-model-bootstrap-close?file=src/app/app.component.ts

Upvotes: 0

Gourav Pokharkar
Gourav Pokharkar

Reputation: 1648

When you click on save button, you call a method and in that method, you may be doing API call using HTTP method. So, in success callback of HTTP you should put the following code:

$('#modal-createUser').modal('hide');

Or if you are not making a server API call, then just add above code to the last in save method.

Upvotes: 0

Pushprajsinh Chudasama
Pushprajsinh Chudasama

Reputation: 7969

You have to write below code after getting API response.I hope it will helps you. 

$('#modal-createUser').modal('hide');

Upvotes: 3

Related Questions