对PHP的AJAX调用接收“先前”发布的数据

Question

So I post data from a form using the jQuery form extension. This code is executed when the user presses ["Save"] on the HTML page.

$('#myform').ajaxForm({
    async: false,
    cache: false,
    target: $(this).find('.save-response'),
    beforeSubmit: function(arr,$form){
        json_ = JSON.stringify (vars.table_settings[aux.getTableId()].by_ix); //, null, 4);
        $form.find('.user-settings').val(json_);
        $form.find('.save-response').stop(true,true).hide().show();
        alert (json_);
    },
    success: function(){
        $(this).fadeOut(15000);
    },

As you see, I use the alert() function to check what is actually being delivered in the AJAX call, to the destination PHP file. What I see is the following:

[
...
{"id":"colpartdesc","vis":"vis","width":500,"ix":3,"desc":"Part Desc."},
...
]

On the PHP file, I read the $_POST value, and feed it back to the calling page (to the .save-response element in this example) as a response. What I get as a reply is this:

[
...
{"id":"colpartdesc","vis":"vis","width":270,"ix":3,"desc":"Part Desc."},
...
]

As you see, the "width" value is different. In fact, a value of 270 is the value that I sent the last time I pressed the ["Save"] button. If I press ["Save"] again, the server will receive the 500 value sent in this call. But it may be that the value of 500 is wrong by that time.

If I press the ["Save"] button twice each time before changing the input, then the functionality works as expected.

As you see, I've disabled the cache in the Ajax call, so I don't think this is the problem.

Does anyone have an idea why I am experiencing this behaviour?

Aside: the original HTML page is generated using Smarty templating engine. However, I have switched off caching in the Smarty engine too, so again, I don't think this is significant. Also, the PHP file processing the Ajax call does not use a Smarty template.

Answer 1

The answer to the problem is that I don't know how the jQuery Form plugin works.

jQuery Form does not submit the values in the fields of the form, but rather the value in the array. Therefore, updating the values in the form itself withing the beforeSubmit function (as done in the following line) is incorrect:

$form.find('.user-settings').val(json_);

What I should be doing instead is to update the form-data array, like this:

$('#myform').ajaxForm({
    $(this).ajaxForm({
        target: $(this).find('.save-response'),
        beforeSubmit: function(formData,$form){
            json_ = JSON.stringify (vars.table_settings[aux.getTableId()].by_ix); //, null, 4);
            formData[1].value = json_;
            $form.find('.save-response').stop(true,true).hide().show();
        },
        success: function(){
            $(this).fadeOut(15000);
        },
    });

The answer to >>this<< post is what put me on the right tracks.