时间戳

首页 > 解决方案 > 使用jquery在一个循环中组合两个表单值

jquery - 使用jquery在一个循环中组合两个表单值

问题描述

大家好，我有一个棘手的问题。

我有这种形式，当我循环位于表头中的所有表单字段时，我希望它们组合成一个数组。

在此处输入图像描述

这是我用来获取所有字段数据的循环

$('#filterTable').find("table select, table input").each(function(key, value) {
                var name = $(this).attr('name');
                var input = {};

                if (this.value !== ''){
                     if (name === 'filter_select') {
                         input.col = $(this).data('col');
                         input.layer_id = $(this).data('layer');
                         input.filterSelect = $(this).val();
                     } else if (name === 'froms'){
                         input.col = $(this).data('col');
                         input.layer_id = $(this).data('layer');
                         input.from = $(this).val();
                     } else if (name === 'to'){
                         input.col = $(this).data('col');
                         input.layer_id = $(this).data('layer');
                         input.to = $(this).val();
                     }

                     if(layerId == "" && input)
                        layerId = input.layer_id;
                     filterForm.push(input);

                     previous_col = $(this).data('col');
                }

            });

此代码为我提供以下输出

0:
col: 2
layer_id: 139
from: "100"

1:
col: 2
layer_id: 139
to: "500"

我想要完成的是组合它们，因为它们具有相同的 col 或者它们位于同一个表头中，所以输出看起来像这样

0:
col: 2
layer_id: 139
from: "100"
to: "500"

知道如何解决这个问题吗？被困在这里这么久了。谢谢

标签： jquery

解决方案

您可以使用$.extend任意属性组合多个对象。

示例代码（没有 html 输入，您可以将其放入“迭代”部分）

var filterForm = [];

// previous iterations of the input loop popuplate filterForm array
filterForm.push({
  col: 2,
  layer_id: 139,
  from: "100"
});

// this iteration gets data from inputs (hardcoded here for simplicity/demo)
var input = {
  col: 2,
  layer_id: 139,
  to: "500"
};

// find if it's already in the array
var existing = filterForm.find(function(e) {
    return e.col == input.col && e.layer_id == input.layer_id;
});
// update existing item or add as a new item
if (existing != null)
    $.extend(existing, input);
else
    filterForm.push(input);

console.log(filterForm);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

推荐阅读