How can I exclude HTML form radio button values from being submitted?

Question

I need to submit just one input field value to a cgi script via a web form.

I've added a couple of extra form controls (a check box and radio buttons) which manipulate the input value depending on the states selected.

When the form is submitted, the extra form field values are submitted as well which breaks the cgi script (which I don't have access to). I removed the 'name' attribute from the check boxes so they are not submitted but cannot do this for the radio buttons as it breaks their grouping.

How can I prevent radio button values from being submitted?

Dinerman

Related: radio without name attribute – Religionism

Answer 1

You can add a disabled attribute to them in the submit handler, this will prevent them from being serialized, either by jQuery or a normal <form> submission. For example:

$("#myForm").submit(function() {
  $(this).find(":radio, :checkbox").attr("disabled", true);
});

Or you can .serialize() only the elements you want, for example:

$.post("myPage.cgi", $("#myForm input[type=text]").serialize());

Weaponry

For jQuery 1.6+, it should be .prop('disabled', true). – Igal

Answer 2

Make them "unsuccessful". There are several ways to achieve this: http://www.w3.org/TR/html401/interact/forms.html#h-17.13.2

Possibly

Answer 3

It is also possible to have two different forms: one that has visible form elements and one that has a hidden input that represents the end result to be submitted. You can either attach onchange handlers to your visible form elements so that they call some JavaScript to update the invisible field, or you can run a function as part of the onsubmit handler to set the invisible value directly before it is submitted.

Here's a jsFiddle demonstrating the second approach (the onsubmit handler): http://jsfiddle.net/gtU4J/

Brierroot