Modifying form values with beforeSubmit with jQuery ajaxSubmit?

Question

I have a form I am submitting using jQuery's ajaxSubmit function from the Forms plugin. I'm trying to add a form name/value pair to the form data just before submission occurs. My plan is to modify the form data in the beforeSubmit event handler.

Given a function that looks like:

function handleActionFormBeforeSubmit(formData, form, options) {
    // Add a name/value pair here somehow to formData
}

How do I add a simple pair to formData? It is an array in the form of:

[ { name: 'username', value: 'jresig' }, { name: 'password', value: 'secret' } ]

Thanks, Brian

Answer 1

After an hour of experimentation, I figured out a solution. To append a value to the form data, the following code will work.

function handleActionFormBeforeSubmit(formData, form, options) {

    // Add a name/value pair indicating this is an asynchronous call.
    // This works with the ASP.NET MVC framework's Request.IsMvcAjaxRequest() method.
    formData[formData.length] = { "name": "__MVCASYNCPOST", "value": "true" };
}

You can also modify the data if you know the index of the value you want to change such as:

formData[0].value = 'new value';

I hope this helps someone else.

Answer 2

This is fine:

formData.push({ "name": "__MVCASYNCPOST", "value": "true" });

Answer 3

formData[0].value = 'new value'; is working fine in AjaxSubmit(). I had implemented same while upload file content dynamically. Earlier after so many time, form send blank data into server, so this code helpful to change before submit your form.