I have a set of buttons in a list, some of them have a disabled
class.
What I want to do
When I click a non-disabled button I want to add disabled to ALL the buttons. After finishing the ajax request, I want to have only the previously AND the clicked button to have a disabled
class.
I tried
$(document).on('click', '.myButton', function (e) {
/* Get this Button */
var $btn = $(this);
/* Get all disabled Buttons */
var allDisabled = $('.disabled');
/* Add disabled to all buttons */
$('.buttonAction').addClass('disabled');
/* Do Ajax Stuff */
$.ajax({
type: 'GET',
...
success: function (data) {
/* Remove all 'disabled' from Buttons */
$('.buttonAction').removeClass('disabled');
/* Add 'disabled' to this Button */
$btn.addClass('disabled');
/* Add 'disabled' to all previous Buttons */
allDisabled.each(function(){
$(this).addClass('disabled');
});
},
...
});
});
Unfortunately the allDisabled.each
function assigns the disabled
to ALL buttons.
WHere am I wrong?