javascript - 正则表达式以嵌套可排序形式更新表单输入多个索引

Question

我有一个简单表单输入的列表，这些输入是可排序的，并且用户可以向表单添加更多行。

名称属性相当简单:

field_id_3[0][options][html_data]
field_id_3[1][options][html_data]
field_id_3[2][options][html_data]

我有一个相当简单的 updateindexes 方法，如下所示:

$container.find('.' + opts.rowClass).each(function(rowCount) {

  regex = /^(.*)\[(?:[0-9]+)\](.*)$/;

  $(this).find('input, select, textarea').each(function(fieldCount) {
    $field = $(this);
    if ($field.attr('name')) {
      var fieldName = $field.attr('name').replace(regex, '$1[' + rowCount + ']$2');
      $field.attr('name', fieldName);
    }
  });
});

这一切似乎运行良好，但现在我需要引入新的元素，这些元素也可以排序和嵌套。我现在正在编写第二个 updateindexes 方法，它将仅处理嵌套索引。

名称属性类似于

field_id_3[0][options][html_data]
field_id_3[1][options][html_data]
field_id_3[2][options][list_items][0][item]
field_id_3[3][options][list_items][1][item]
field_id_3[4][options][html_data]

我坚持的是修改正则表达式模式，以便第一个数组索引和任何第二个数组索引的替换在两个更新索引方法中彼此独立。

如何使用正则表达式独立定位第一个 [key] 属性和第二个 [key] 属性？

谢谢

Answer 1

这里的方法与您请求的方法略有不同，其中工作函数根据传递给它的参数对所有索引重新编号。

这是工作函数:

var indexFinder = /\[(?:[0-9]+)\]/g; //defined once to give reIndex() a little less work to do.

function reIndex(str) {
    str = str.replace(indexFinder, '[]');
    for(var i=1; i<arguments.length; i++){
        str = str.replace('[]', '['+arguments[i]+']');
    }
    return str;
}

<强> DEMO

接下来的挑战是设计一个循环结构来调用 reIndex()。

也许是这样的，假设 list_items 被分组在合适的容器中:

var itemGroupSelector = '.itemGroup'; //or similar
var fieldSelector = 'input, select, textarea';

$container.find('.' + opts.rowClass).each(function(rowCount, row) {
    var $row = $(row);
    $row.find(fieldSelector).each(function(i, field) {
        $field = $(field);
        if ($field.attr('name')) {
            var fieldName = reIndex($field.attr('name'), rowCount);
            $field.attr('name', fieldName);
        }
    });

    $row.find(itemGroupSelector).each(function(itemCount, itemGroup) {
        $(itemGroup).find(fieldSelector).each(function(i, field) {
            $field = $(field);
            if ($field.attr('name')) {
                var fieldName = reIndex($field.attr('name'), rowCount, itemCount);
                $field.attr('name', fieldName);
            }
        });
    });
});

还有一些工作要做，但我确信这可以实现。