Rounds
Rounds

Reputation: 1889

Bootstrap loading button and ajax

I'm trying to make a button change state on click and go back to normal on server response, here's my code:

            $(document).ready(function() { 
    var options2 = { 
        success:   processJson,  // post-submit callback 
        dataType:  'json',
        url:  'test.php?act=test'
    }; 
    $('#formProfileInfo').ajaxForm(options2);
    $('#save')
    .click(function () {
        var btn = $(this)
        btn.button('loading')
    }); 
function processJson(data)  { 
            if( data.status === 'success' ) {
                alert.success(data.message);
}
            if( data.status === 'error' ) {
                alert.error(data.message);
}
$('#save')
$(function() {
            btn.button('reset')
    });
}
        });

I'm using the jQuery Form Plugin for form submit via ajax.

The button is changing to loading stat but it's not resetting..

Upvotes: 1

Views: 1911

Answers (3)

Rounds
Rounds

Reputation: 1889

Okay, I've managed to get it to work by using:

$('#save').button('reset');

instead of:

$('#save')
$(function() {
            btn.button('reset')
    }); 

Upvotes: 1

user23031988
user23031988

Reputation: 330

I can see that you have a jquery selector for "save" id and after that you have no function applied over it:

$('#save')
$(function() {
            btn.button('reset')
    });
}

I don't think you need $('#save') or $(function() in order to reset the button

Upvotes: 0

Tim Wasson
Tim Wasson

Reputation: 3656

Can't you put btn.button('reset') up under the processJson function, after the success alert?

Upvotes: 0

Related Questions