通过jQuery AJAX传递表单数组数据

Question

I have a form that allows you to add multiple listings at one time.

I also have to pass through an md5check.

IE)

<select name="master_id"></select>

<select name="id2[]"></select>
<select name="id3[]"></select>
<input name="text[]"></input>
<input name="text2[]"></text>
<input name="text3[]"></text>
<input name="check[]" type="checkbox"></input>

<select name="id2[]"></select>
<select name="id3[]"></select>
<input name="text[]"></input>
<input name="text2[]"></text>
<input name="text3[]"></text>
<input name="check[]" type="checkbox"></input>

<select name="id2[]"></select>
<select name="id3[]"></select>
<input name="text[]"></input>
<input name="text2[]"></text>
<input name="text3[]"></text>
<input name="check[]" type="checkbox"></input>

jQuery.ajax({
    type: "POST",
    url: ipb.vars['base_url'] + "app=main&module=ajax&section=upload&do=upload",
    data: {
        'md5check': ipb.vars['secure_hash'],
    }
    }).done(function() {
    alert( "Data Saved:");
    });

I want to pass in the master ID and the arrays through AJAX so that they then can be $_REQUEST'ed in PHP. The 'md5check' must be there.

Answer 1

data can also take a string so, you can used

jQuery.ajax({
  type: "POST",
  url: ipb.vars['base_url'] + "app=main&module=ajax&section=upload&do=upload",
  data: $('input[name="username[]"],input[name="password[]"],input[name="rawtext[]"]').serialize()
    + '&md5check='+ipb.vars['secure_hash'],
}).done(function() {
  alert( "Data Saved:");
});

Answer 2

HTML Form:

<form action="" method="POST" id="myform">
    <input name="username[]">
    <input name="password[]">
    <input name="rawtext[]">
    <input name="username[]">
    <input name="password[]">
    <input name="rawtext[]">
    <input name="username[]">
    <input name="password[]">
    <input name="rawtext[]">
   <input name="submit" type="submit" value="submit">
</form>

jQuery:

$('#myform').submit(function(event) {
     event.preventDefault();
     //comment this line out
     alert($(this).serialize());
     $.post(ipb.vars['base_url'] + "app=main&module=ajax&section=upload&do=upload&", { 
     $(this).serialize() })
    .done(function(data) {
    alert("Data Loaded: " + data);
  });
 return false;
});

Answer 3

You can use the following.

$('#myform').submit(function(e) {
    e.preventDefault();
    e.stopPropagation();

    var formData = $(this).serializeObject();
    var postData = $.extend({}, formData, {
        app: main,
        module: ajax,
        section: upload,
        do: upload
    });

    $.post(ipb.vars['base_url'], postData,
        function(data) {
            alert(data);
        }
    );
});

$.fn.serializeObject = function() {
    var objectData = {};
    var serializeArr = this.serializeArray();

    $.each(serializeArr, function() {
        if(objectData[this.name] !== undefined) {
            if(!objectData[this.name].push) {
                objectData[this.name] = [objectData[this.name]];
            }

            objectData[this.name].push($.trim(this.value) || '');
        } else {
            objectData[this.name] = $.trim(this.value) || '';
        }
    });

    return objectData;
};