how to prevent form from sending some fields we don't want to send?

Question

hi, i have form that have about 5 fields which final query created by processing values that fields. i want to send only final query not all fields to server. can i exclude some fields from submitting (with jquery)?

<form action="abc/def.aspx" method="get">
    <input type="text" name="field1" />
    <input type="text" name="field2" />
    <input type="text" name="field3" />
    <input type="text" name="field4" />
    <input type="text" name="field5" />
    <input type="hidden" name="final" />
    <input type="submit" value="Send" />
</form>

which generate url like this:

abc/def.aspx?field1=val1&field2=val2&field3=val3&field4=val4&field5=val5&final=finalQuery

Answer 1

Remove the element on submit.

On the onsubmit handler:

$(formElement).submit(function() {
    $(this.field1).remove(); //removing field 1 from query
    return true; //send
});

Disabling the form element also stops it from being entered into the query.(tested on Chrome)

$(formElement).submit(function() {
    this.field1.disabled = true;
    return true; //send
});

Answer 2

I think the best solution is to handle the submit and then send the request yourself:

$(form).submit(function() {
    //do everything you need in here to get the final result
    var finalResult = alotoflogic();
    $.get("abc/def.aspx",final=finalResult, "callbackfunction", "responseType");
    return false;
});

that should do exactly what you want. EDIT: as Alex pointed out this solution wouldnt send you to that page, just get the results if you need to go to the new page you can do:

$(form).submit(function() {
    //do everything you need in here to get the final result
    var finalResult = alotoflogic();
    window.location('abc/def.aspx?final='+finalResult);
    return false;
});

This way the browser is redirected to that page and only the final result is send.