JavaScript submit form excluding fields

Question

I have a simple html form:

<form action="test" method="post" id="myForm">
    <input type="text" name="myTextField">
    <input type="text" name="myTextField2">
    <input type="text" name="dontSubmitThisField">
</form>

And I need to submit it with JavaScript, but I want to exclude the dontSubmitThisField field from the request. Is there a way of doing that without Ajax?

Profuse

The disabled html attribute will do what you want – Arianaariane

Answer 1

Just disable the field.

Either do it via HTML if the field cannot be updated by the user: http://www.w3schools.com/tags/att_input_disabled.asp

Or do it via jQuery with a on submit event:

$('#myForm').submit(function(){
    $('input[name="dontSubmitThisField"]').prop('disabled', true);
});

Flatulent

Answer 2

Disabled fields or fields without a name attribute won't submit.

However, if somehow you want to name your fields and do not want to disable them upfront, you could intercept all form submissions and disable every fields that have a data-no-submit attribute.

document.addEventListener('submit', function (e) {
    if (!e.defaultPrevented) {
        [].forEach.call(e.target.querySelectorAll('[data-no-submit]'), function (field) {
            field.disabled = true;
        });
    }
});

Then you can just do:

<input type="text" name="dontSubmitThisField" data-no-submit>

Cabotage

Answer 3

Just add form="nosubmit" to the input. This assigns the field to a different form altogether, so it won't be submitted.

Vesture

Not my first choice for most cases, but pretty clever. This may be the right answer for someone. – Expurgatory

Answer 4

Why would you collect information you don't need?

Regardless, if you remove the field's name it won't POST

Flavescent

It's not because you do not send the information to the server that you do not need to collect it. Think about a password change form. You would have a passwordConfirmation field which doesn't have to be sent. – Cabotage

Answer 5

You can disable the field, and it won't be included in the post vars. Disabled form fields are not submitting data

Crazed

Answer 6

To submit the form with JavaScript use myForm.submit(); To exclude the field, remove the name. You can keep an ID if you need to reference the field for some reason. Or - you can just ignore the field altogether on the server side.

Alpenhorn