Is there a way to remove a form element without using jQuery.remove ()?

Question

Using . remove () so that the "Select All" checkbox is not sent to the server.

However, it is displayed to the user because the Select All checkbox is “physically” removed from the web page after sending.

Instead, I would like to remove the Select All check box so that it looks seamless, but NOT on the server side. that is - I would like to keep the input on the page, but delete the element in the form array until it is submitted.

Is it possible to manipulate the element [] array of the form before sending it to the server and delete it there?

Thanks.

Answer 1

If you uncheck this box, it will not be sent along with the rest of the form:

$('#myInp').attr("disabled", true); 

Using this method, you can turn off the item while sending and turn it back on immediately after:

 $('#myForm').submit(function() { var $myInp = $('#myInp'); $myInp.attr("disabled", true); window.setTimeout(function () { $myInp.attr("disabled", false); }, 0); }); 

Answer 2

and Andy E and Munk have viable solutions. Here is another:

Replace it with another inert flag

 $('#select-all-checkbox').replaceWith( '<input type="checkbox"/>' ); 

Of course, this can create problems if for any reason the submission of the form fails.

Answer 3

It’s not possible at the moment to manipulate the form’s dataset (and what I want to see in future versions of HTML either ), but you can fake it by temporarily disabling input while submitting:

 $form.submit(function(){ $input.attr('disabled', true); setTimeout(function(){ $input.removeAttr('disabled'); }, 0); });