Question

I create HTML checkboxes dynamically using PHP and MySQL. They can look like this:

<input type='checkbox' name ='chkDel' value='11'>
<input type='checkbox' name ='chkDel' value='18'>
<input type='checkbox' name ='chkDel' value='55'>

Then I have this jQuery script that checks if one or more checkboxes are checked and processes the information in a PHP file. For each checkbox checked it removes a row in a databse table.

$('#delete_absence_row').click(function() {
        var query_string = ''; 
        $('input[type=checkbox]').each( 
            function() { 
                if (this.checked) { 
                        query_string += "&chkDel[]=" + this.value; 
                    } 
            });
    $.ajax({ 
        type: "POST", 
        url: "../updateAbsence.php", 
        data: query_string, 
        success: 
            function(t) { 
                $("div#content_response").empty().append(t);
            }, 
        error: 
            function(){ 
                $("div#content_response").append("An error occured during processing"); 
            } 
        }); 
    });

Now I would like to append a .remove(); to each checkbox that are marked, that is all checkboxes that are in the query_string in the success:function(t)

I dont’t know jQuery that much and the code above is a mix of different solutions I found on the web so bear with me.

How do I remove the checkboxes marked after a success function?

Answer 1

$('#delete_absence_row').click(function() {
        var query_string = '';
        var todelete = [];
        $('input[type=checkbox]:checked').each( 
            function() { 
                query_string += "&chkDel[]=" + this.value;
                todelete.push(this);
            });
    $.ajax({ 
        type: "POST", 
        url: "../updateAbsence.php", 
        data: query_string, 
        success: 
            function(t) { 
                $("div#content_response").empty().append(t);
                $.each(todelete, function (i, e) {
                    $(e).remove();
                });
            }, 
        error: 
            function(){ 
                $("div#content_response").append("An error occured during processing"); 
            } 
        }); 
    });