Search code examples
javascriptjqueryajaxtwitter-bootstrapbootstrap-modal

Why can't I change backdrop to 'true' or remove it after changing to 'static' in Bootstrap?


I'm trying to figure out why I can't change the backdrop to 'true' after first changing it to 'static' when using Bootstrap's modal.

I run this code:

$('#modal').modal({backdrop: 'static', keyboard: false, show: true});

$.post('server.php', $('#form').serialize(), function(data) {
    if(data.success) {
        $('#modal').modal({backdrop: true, keyboard: true});
    } else {
        $('#modal').modal({backdrop: true, keyboard: true});
    }
}, 'json');

It will set it so the backdrop and keyboard will not function at the start, but I cannot figure out why I can't set it back to default.

Thanks for reading.


Solution

  • How about this

    it looks like twitter bootstrap is storing all data in a data variable called bs.modal. so just remove that data variable and reinitialize the modal.

    Your final code will look something like this

    $('#modal').modal({backdrop: 'static', keyboard: false, show: true});
    
    $.post('server.php', $('#form').serialize(), function(data) {
        if(data.success) {
            $('#modal').removeData('bs.modal').modal({backdrop: true, keyboard: true});
        } else {
            $('#modal').removeData('bs.modal').modal({backdrop: true, keyboard: true});
        }
    }, 'json');