简体   繁体   中英

JQUERY: how to serialize input fields with same name

I have the following form that has lots of similar type of input fields with same name (eg. 10 fields for 'name', 10 fields for 'address'). How many times these input fields will repeated, can not be said in prior and therefore they cannot be given static different names (eg. 'name1', 'name2', 'address1', 'address2').

Problem: while I am posting data using ajax post (serialized), its only posting the first value of fields with same name (received with php).

Required:

  1. How can I get all the input data posted properly?
  2. Whats the best way to name such input fields that contain similar data for the purpose of catching those data with php (form is generated in php)?

Sample code:

    <form name="content">
     <table>
      <tr>
       <td>
        <input name="full_name" type="text" />
       </td>
       <td>
        <input name="address" type="text" />
       </td>
      </tr>
      <tr>
       <td>
        <input name="full_name" type="text" />
       </td>
       <td>
        <input name="address" type="text" />
       </td>
      </tr>
    </table>
   </form>

I think in your case you can use $.serializeArray() :

var data = $('form[name="content"]').serializeArray();

this will produce something like this:

data = [
     {
       name : "full_name",
       value : "thefieldvalue"
     },
     {
       name : "address",
       value : "theaddressvalue"
     },
     .....
];

See this:

data:$('form[name="content"]').serializeArray()+'&request=insert_invoice' 

not a correct way to send data instead you can try with this below:

data:{
    frmvalues : $('form[name="content"]').serializeArray(), 
    request:insert_invoice
} 
<input name="full_name[]" type="text" value="foo" />
<input name="full_name[]" type="text" value="bar" />

In PHP it will be:

Array (
    full_name => Array (
         0 => foo
         1 => bar
    )
)

You have to serialize the data and send it through ajax. On the php side unserialize the data and format it through this function to get the output described the comment above mine. Without it, it will won't return the desired output.

 public function serializedFormDatajQuery2Array($serializedArr){
                  $aFormData = array();
                  foreach($serializedArr as $aRow){

                     if(isset($aFormData[$aRow['name']]) && !is_array($aFormData[$aRow['name']])){
                        $sValue = $aFormData[$aRow['name']];
                        $aFormData[$aRow['name']] = array();
                        $aFormData[$aRow['name']][] = $sValue;
                        $aFormData[$aRow['name']][] = $aRow['value'];
                        continue;
                     }

                                if(is_array($aFormData[$aRow['name']])){
                                            $aFormData[$aRow['name']][] = $sValue;
                                            continue;
                                }

                  $aFormData[$aRow['name']] = $aRow['value'];
                  }
                             return $aFormData;
            }

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM