0

我已经开始通过表单中的按钮动态添加元素的指南。

指南在这里添加表单元素

现在，我可以遵循其中的大部分内容（我几乎没有 jQuery 经验），但在我的例子中，我希望添加文件字段，但命名约定有点不同，这让我很困惑。

就我而言，我的第一个输入有名称name="matrix_field[row_new_0][col_id_1]"，这是row_new_0我需要增加的。我不确定如何让它工作，因为数字不在名称的末尾。希望这是有道理的！

根据要求进行快速编辑。

这是这个的标记。它直接取自我链接到的教程。

<form id="myForm">
    <input type="hidden" name="matrix_field[row_order][]" value="row_new_0" />

    <div id="input1" class="clonedInput">
       <input type="file" name="matrix_field[row_new_0][col_id_1]" />
    </div>

    <div>
       <input type="button" id="btnAdd" value="add another name" />
       <input type="button" id="btnDel" value="remove name" />
    </div>
</form>

继承人的 Javascript，以及 jramby 的建议，但我得到了一些奇怪的结果....

<script type="text/javascript">
        $(document).ready(function() {
            $('#btnAdd').click(function() {
                var num     = $('.clonedInput').length;
                var newNum  = new Number(num + 1);

                var newElem = $('#input' + num).clone().attr('id', 'input' + newNum);

                newElem.children(':first').attr('id', 'name' + newNum).attr('name', 'matrix_field[row_new_' + newNum + '][col_id_1]');
                $('#input' + num).after(newElem);
                $('#btnDel').attr('disabled','');

                if (newNum == 5)
                    $('#btnAdd').attr('disabled','disabled');
            });

            $('#btnDel').click(function() {
                var num = $('.clonedInput').length;

                $('#input' + num).remove();
                $('#btnAdd').attr('disabled','');

                if (num-1 == 1)
                    $('#btnDel').attr('disabled','disabled');
            });

            $('#btnDel').attr('disabled','disabled');
        });
    </script>

这是添加额外的字段，但似乎得到了一些奇怪的标记，所以我猜测它与我的 js 中的其他内容冲突。

无论如何，这是一个http://jsfiddle.net/DdrfA/

然而，这似乎跳过了 row_new_1 因为它从row_new_0直接到row_new_2并且删除按钮似乎也不起作用。

希望这可以帮助！

4

2 回答 2

0

而不是添加这一行：

newElem.children(':first').attr('id', 'name' + newNum).attr('name', 'name' + newNum);

你只需要输入这一行：

newElem.children(':first').attr('id', 'name' + newNum).attr('name', 'matrix_field[row_new_' + newNum + '][col_id_1]');

如果我能获得更多详细信息，可能会有所帮助...我认为您可以在我的答案中看到缺少的问题详细信息（如果存在）。

于 2013-01-30T04:13:21.620 回答
0

row_new_0你可以很容易地解析出来。这是基于链接的示例：

var newElem = $("#input").clone().attr('name', function (_, name) {
   return name.replace('row_new_0', 'row_new_' + num);
});

http://jsfiddle.net/Mdhn2/

于 2013-01-30T03:54:10.610 回答