Question

我有一个包含许多输入的表单，但我在这里关注的两个名称是attributes[]和options[$index][]这是我的attributes[]输入中的示例数据：

Array
(
    [0] => Size
    [1] => Color
    [2] => Material
)

Note: The above is the $_POST data visualized as PHP array
Below is what the HTML form would look like:

<input name="attributes[]" value="Size">
<input name="attributes[]" value="Color">
<input name="attributes[]" value="Material">

这就是来自options[$index][]的数据：

Array
(
    [1] => Array
        (
            [0] => Small
            [1] => Medium
            [2] => Large
            [3] => 
        )

    [2] => Array
        (
            [0] => Red
            [1] => Blue
            [2] => Green
            [3] => 
        )

    [3] => Array
        (
            [0] => Cotton
            [1] => Wool
            [2] => 
        )

)

Note: The above is the $_POST data visualized as PHP array
Below is what the HTML form would look like:

<input name="options[1][]" value="Small">
<input name="options[1][]" value="Medium">
<input name="options[1][]" value="Large">

<input name="options[2][]" value="Red">
<input name="options[2][]" value="Blue">
<input name="options[2][]" value="Green">

<input name="options[3][]" value="Cotton">
<input name="options[3][]" value="Wool">

（请注意，有时attributes[]的索引值可能与options[$index][]上相应数组的索引值不匹配）

我正在尝试动态创建一个表，其中attributes[]中的每个非空元素都有一列，可用的每个COMBINATION选项都有一行，因此对于上面的表，这是示例表的样子像：

+-------+-------+----------+-----+
| Size  | Color | Material | SKU |
+-------+-------+----------+-----+
| Small | Red   | Cotton   | 100 |
| Small | Red   | Wool     | 101 |
| Small | Blue  | Cotton   | 102 |
| Small | Blue  | Wool     | 103 |
| Small | Green | Cotton   | 104 |
| ...   | ...   | ...      | ... |

我已经有一个函数来计算数组的笛卡尔积，它输出一个带有组合的数组数组（参考：https://stackoverflow.com/a/12305169/1043817）

我不确定如何从输入中获取所有值，将它们转换为数组并将它们输入CartProd()函数。此时我主要关注的是option[$index][]输入。

从上面的示例数据来看，这就是我想要制作的内容：[small, medium, large] [Red, Blue, Green] [Cotton, Wool]

Answer 1

这是小提琴http://jsfiddle.net/0cool/d7n5h/。

var yourSampleData =
  (function (allInputs, _, _out, _trimstr, _attrIdxs, _safereg) {
  _attrIdxs(allInputs)
    .forEach(
      function (idx) {
        _out.push(
          _.filter.call(
            allInputs,
            function (input) {
              return (new RegExp("^options\\[" + _safereg(idx) + "\\]"))
                .test(String(input.name)) && _trimstr(input.value).length;
            }
          )
          .map(
            function (validinput) {
              return _trimstr(validinput.value);
            }
          )
        );
      }
  );
  return _out;
})(

  document.getElementsByTagName("input"),

  Array.prototype,

  [],

  // _trimstr
  (function () {
    var blanks = /^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g;
    return function (str) {
      return String(str).replace(blanks, "");
    };
  })(),

  // _attrIdxs
  (function () {

    var _ = Array.prototype;
    var attrMatcher = /^attributes/;
    var idxMatcher = /^attributes\[(.+?)\]/;

    return function (allInputs) {
      var out = [];
      _.filter.call(
        allInputs,
        function (input) {
          return attrMatcher.test(String(input.name));
        }
      )
        .forEach(
          function (input) {
            var ind;
            ( out
              .indexOf( ind = +String(input.name).match(idxMatcher)[1] ) ^ -1
            ) || out.push( ind );
          }
      );
      return out;
    };
  })(),

  // _safereg
  (function (REGEX_ESCAPER) {
    return function (strreg) {
      return String(strreg).replace(REGEX_ESCAPER, '\\$1');
    }
  })(/([.*+?\^=!:${}()|\[\]\/\\])/g)

);


//
// and with your cartesian function:
//
//   var
//      cProd = cartProd.apply( this, yourSampleData );
//

console.log( yourSampleData );
//
//
//

将表单中的某些输入转换为数组

1 个答案: