html - How to group input values in a form when being submitted? -

i have input values dynamically generated via js , upon submitting form, values grouped somehow fail see way it. reason why need them grouped when retrieve data, easier loop through.

consider html:

<div class="column one">      <div class="module">          <input type="hidden" name="module1[order][]" value="1" />          <input type="hidden" name="module1[column][]" value="1" />      </div>       <div class="module">          <input type="hidden" name="module5[order][]" value="2" />          <input type="hidden" name="module5[column][]" value="1" />      </div> </div>  <div class="column two">      <div class="module">          <input type="hidden" name="module2[order][]" value="1" />          <input type="hidden" name="module2[column][]" value="2" />      </div>       <div class="module">          <input type="hidden" name="module1[order][]" value="2" />          <input type="hidden" name="module1[column][]" value="2" />      </div> </div> 

so html can see each module type belongs column , each column can have multiple modules of different types. , in module there 2 input values each holding data corresponding column , position in dom.

so when submitted array group columns , group order values together. make hard me data when displaying form again.

i trying group input values modules instead of values inside modules.

please let me know if need explain further know confusing read.

thanks!

i this: if change actual order of dom elements, order of them being submitted changes. if jquery changes order have elements this:

div class="column one">      <div class="module">          <input type="hidden" name="modules[3][type]" value="1" />          <input type="hidden" name="modules[3][content]" value="fasdf" />      </div>       <div class="module">          <input type="hidden" name="modules[1][type]" value="2" />          <input type="hidden" name="modules[1][content]" value="image" />       </div> </div>  <div class="column two">      <div class="module">          <input type="hidden" name="modules[2][type]" value="1" />          <input type="hidden" name="modules[2][content]" value="heading" />      </div>       <div class="module">          <input type="hidden" name="modules[0][type]" value="2" />          <input type="hidden" name="modules[0][content]" value="what ever" />      </div> </div> 

the problem is, php takes index sorting array okay , normal. result:

array(4) {    [3]=> array(2) { ["type"]=> string(1) "1" ["content"]=> string(5) "fasdf" }    [2]=> array(2) { ["type"]=> string(1) "1" ["content"]=> string(7) "heading" }    [1]=> array(2) { ["type"]=> string(1) "2" ["content"]=> string(5) "image" }    [0]=> array(2) { ["type"]=> string(1) "2" ["content"]=> string(9) "what ever" } } 

there 2 ways fix this. 1 add little code dragging function (if possible) or before sending form (jquery):

function check() {    alert("he");    $i = 0;    $(".module").each(function(){       $(this).find("input[name*='type']").attr("name", "modules["+$i+"][type]"); //*= means       $(this).find("input[name*='content']").attr("name", "modules["+$i+"][content]");       $i++;    });    return true; } 

this change indexes before submitting form. how al:

array(4) {    [0]=> array(2) { ["type"]=> string(1) "1" ["content"]=> string(5) "fasdf" }    [1]=> array(2) { ["type"]=> string(1) "2" ["content"]=> string(5) "image" }    [2]=> array(2) { ["type"]=> string(1) "1" ["content"]=> string(7) "heading" }    [3]=> array(2) { ["type"]=> string(1) "2" ["content"]=> string(9) "what ever" } } 

is data structure can work with?