jquery + datatables + on success of ajax call, change class of submit button that was pressed

StackOverflow https://stackoverflow.com/questions/8805975

  •  26-10-2019
  •  | 
  •  

Question

I have a datatable that has a form in each row for changing the status of the specific row. this form is called via ajaxForm() library.

<form action="map/statuschange/289.html" method="post" accept-charset="utf-8" class="point-actions-form  form-status" id="point-status-change-289">
    <input type="submit" name="status-link" value="" id="deactivate-point" class="status-link status-link-activate">
</form>

this is the ajaxForm() js:

$('.form-status').ajaxForm({
    dataType: 'json',
    type: 'POST', 
    success: function(){
        if ($('.point-actions-form > .status-link').hasClass('status-link-deactivate')){
            $(this).removeClass('status-link-deactivate').addClass('status-link-activate');
        }else{
            $(this).removeClass('status-link-activate').addClass('status-link-deactivate');
        }
        showResponseForm;
    }
});

Now, when a user clicks on the submit button i need it to change the class of that specific button they clicked, and not all of the buttons that appear in the table. How can i go about doing this?

Was it helpful?

Solution

Looking at the source-code of the ajaxForm plugin, it gives you the form object as fourth parameter in the callback! So you can do this:

success: function(data, status, xhr, form){
    $('#deactivate-point',form).removeClass("status-linke-activate").addClass("status-link-deactivate");
}

(see also: http://jsfiddle.net/fj9Bd/1/)

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top