CODEWITHSUNDEEP
javascriptjquerytwitter-bootstrapbootbox
user123456789
user123456789

Reputation: 566

Bootstrap Bootbox removing popup after clicking save button

HTML

<a href="#modal-2" role="button" class="btn" data-toggle="modal">Modal with animation</a>

<div id="modal-2" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                <h3 id="myModalLabel">Modal header</h3>
            </div>
            <div class="modal-body">
                <p>One fine body…</p>
            </div>
            <div class="modal-footer">
                <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
                <button class="btn btn-primary"  id="book" >Save changes</button>
            </div>
        </div>

i have used floowing JS, but no result

 $('#book').click(function(e) {
       $.ajax({
            url: base_url+"admin/login/",
            type: "get",
            data: {Name:name, Mobile:mobile},
            success: function( strData ){
                //$('.modal, .modal-backdrop').hide();
                $("#modal-2").modal('hide');

            },
            error: function(){
                $('#report').text('Sorry, Please try again').css('color', 'red');
            }
        });
    });

here i want to call a ajax function in callback after clicking save button. then after on ajax success i want to close the bootbox popup

Upvotes: 2

Views: 3363

Answers (2)

olq
olq

Reputation: 191

inside ajax definition you should use parameter

async : false

It's possible that you will have to use custom buttons inside the body of the modal window, not these from bootbox

Upvotes: 0

SQLGuru
SQLGuru

Reputation: 1099

If you were to use BootBox, you could do something like this:

bootbox.dialog({
        message: "Your Message Here - You can pass in an HTML string",
        title: "Your Title",
        onEscape: function () {
            bootbox.hideAll();
        },
        buttons: {
            danger: {
                label: "Cancel",
                className: "btn default",
                callback: function () {
                    bootbox.hideAll();
                }
            },
            success: {
                label: "Add",
                className: "btn blue",
                callback: function () {

        //Add functionality here

        // Then close the model using
        bootbox.hideAll();

                }
            }
        }
    });

Upvotes: 1

Related Questions