jQuery从大表单创建/添加到多维数组

时间:2013-06-12 01:29:27

标签: jquery dynamic multidimensional-array

我不了解jQuery如何处理多维数组。

我在向导插件中有一个非常大的表单。一步可以有多达10个选项卡,每个选项卡中可以有几十个文本输入。我正在尝试使用.each来收集所有文本输入并将它们排列在一个多维数组中。

var ItemsArray = [];
var ItemGroup = [];
$('.GroupOfTabs').each(function() { //for each tab
  var TabName = $(this).val();

  //for each input inside each tab
  $('#step-3 tr[room='+TabName+'][object=item]').each(function() { 
    var value1 = $('#step-3 input[tab='+TabName+'][other=value1]).val();
    var value2 = $('#step-3 input[tab='+TabName+'][other=value2]).val();
    var value3 = $('#step-3 input[tab='+TabName+'][other=value3]).val();
    var value4 = $('#step-3 input[tab='+TabName+'][other=value4]).val();

    ItemGroup.push( {value1, value2}, {value3, value4} );   
    ItemsArray[TabName].push(ItemGroup);
  });
});

HTML看起来像这样:

<div class="GroupOfTabs" value="tab1">
  <table>
    <tr room="tab1" object=item>
      <td><input tab=tab1 other=value1></td>
      <td><input tab=tab1 other=value2></td>
      <td><input tab=tab1 other=value3></td>
      <td><input tab=tab1 other=value4></td>
    </tr>
  </table>
</div>

等等,有很多标签和更多输入。

所以我所希望的是一个很好的有组织的多维数组,如下所示:

ItemsArray
{
     Tab1 : { value1 : value2 }, {value3 : value4}
     Tab2 : { value1 : value2 }, {value3 : value4}
     Tab3 : { value1 : value2 }, {value3 : value4}
}

//An easier way for me to articulate the array structure is php style:

(ItemsArray => array( Tab1 => array(value1 => value2, value3 => value4),
               array( Tab2 => array(value1 => value2, value3 => value4),
               array( Tab3 => array(value1 => value2, value3 => value4))

我甚至不打算显示我得到的实际输出是什么......安全地假设它是一个可怕的混乱。它甚至没有返回所有文本输入,只是每个选项卡中的第一个。

正确的方法?

提前致谢!

1 个答案:

答案 0 :(得分:0)

您将变量定义为数组,但基于您希望的输出,您似乎真的想要使用对象。我们对您的文档结构了解不多,因此以下只是基于您尝试的内容进行猜测。

(我假设您在value1-value4中获得了正确的值。)

var ItemsArray = {}; $('.GroupOfTabs').each(function() { //for each tab   var TabName = $(this).val();

  //for each input inside each tab   $('#step-3 tr[room='+TabName+'][object=item]').each(function() { 
    var value1 = $('#step-3 input[tab='+TabName+'][other=value1]').val();
    var value2 = $('#step-3 input[tab='+TabName+'][other=value2]').val();
    var value3 = $('#step-3 input[tab='+TabName+'][other=value3]').val();
    var value4 = $('#step-3 input[tab='+TabName+'][other=value4]').val();

    ItemsArray[TabName] = [ { value1 : value2 } , { value3 : value4 } ];   }); });

ItemsArray的结构对我来说并没有多大意义。假设您的样本输出实际上是您想要的,我认为这应该有效。