Question

我有通过JS动态生成的输入值，并且在提交表单时，我希望以某种方式对这些值进行分组，但是没有找到方法来执行它。我需要将它们分组的原因是当我检索数据时，它将更容易循环。

考虑这个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>

因此，从HTML中可以看出每个模块类型都属于一个列，每个列可以有多个不同类型的模块。在模块中有两个输入值，每个输入值保存对应于DOM中列和位置的数据。

因此，当提交此数组时，数组会将所有列组合在一起并将所有订单值组合在一起。这会让我很难在再次显示表单时获取数据。

我正在尝试按模块而不是模块内的值对输入值进行分组。

如果我需要进一步解释，请告诉我，因为我知道这可能令人困惑。

谢谢！

Answer 1

我会这样做：如果更改DOM元素的实际顺序，则提交它们的顺序也会更改。如果jQuery改变了这个顺序，我会有这样的元素：

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>

问题是，PHP采用索引来排序数组，这是正常的。这将是结果：

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" }
}

有两种方法可以解决这个问题。一种方法是在拖动函数中添加一些代码（如果可能的话），或者在发送表单（jQuery）之前执行类似的操作：

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

这将在提交表单之前更改索引。我怎么得到这个：

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" }
}

这是一个可以使用的数据结构吗？

如何在提交时对表单中的输入值进行分组？

1 个答案: