Question

I have a set of records which are displayed in tabular format in a form. On each record there is a delete checkbox – here is the form in simplified format:

<form method="post" action="" id="update-history-form">
  Item 1 <input type="checkbox" value="1" name="History[0][delete]">
  Item 2 <input type="checkbox" value="1" name="History[1][delete]">
  Item 3 <input type="checkbox" value="1" name="History[2][delete]">

  <input type="submit" value="Update History" name="update">
</form>

The integer value in the input ‘name’ attribute helps identify which records have been selected for deletion.

What I want is for a JavaScript alert confirmation to appear if any of the delete checkboxes have been ticked (upon submit).

Answer 1

$('#update-history-form').submit(function(){
  if ( $(this).find('input:checkbox:checked').length ){
    return confirm( "Really delete any of them?" );
  }
});

This will cancel the form submission of the user does not OK the confirmation dialog.

If you have non-delete checkboxes in your form you may need to modify the selector to only those inputs whose name contains “delete”, e.g.

$(this).find( 'input[name*="delete"]:checked' )