2

是否可以结合以下两个功能同时保持它们分开？

该cloneMe函数克隆一组字段并为它们提供新的名称和 ID，因此使用 foreach 我可以将每个组作为单独的行放入数据库中。

该addRow函数将 2 个字段（'Bracing' 和 'Qty'）添加到克隆组，可以添加无限数量的这些字段，但它们需要被视为克隆组的一部分，cloneMe所以我可以把这 2字段到他们自己单独的数据库表中。

到目前为止，我试图让addRow生成的字段被视为组的一部分的所有cloneMe内容都导致addRow字段被视为空，并且只有第一个是第一组的一部分并且无法向第二组添加任何内容或超越群体。

我已经将所有内容都放入了 jsFiddle：http: //jsfiddle.net/AnJzU/虽然addRow似乎不想在那里工作。

cloneMe功能;

$(document).ready(function() {
    var newNum = 2;
    cloneMe = function(el) {
        var newElem = el.clone().attr('id', 'container' + newNum);
        newElem.html(newElem.html().replace(/form\[1\]/g, 'form['+newNum+']'));
        newElem.html(newElem.html().replace(/id="(.*?)"/g, 'id="1'+newNum+'"'));
        $('#cloneb').before(newElem);
        newElem.find('.delete_name').html('<p class="rem_field"><a href="#"><span>X</span></a></p>');
        newNum++;
    };

    $(document).on('click', '.rem_field', function() {
        $(this).closest('.instance').remove();
        return false;
    });    

});

addRow功能;

var rowNum = 0;
function addRow(frm) {
   rowNum ++;
   var row = '<span id="rowNum'+rowNum+'"><table cellpadding="0" cellspacing="0" border="0"><tr><td><label for="test">Bracing:</label><input type="text" name="form['+rowNum+'][brac]['+rowNum+'][bracing]" size="4" class="brac" value=""></td><td><label for="test2">Qty:</label><input type="text" name="form['+rowNum+'][brac]['+rowNum+'][qty]" class="qty" value=""></td><td><input type="button" class="rem" value="X" onclick="removeRow('+rowNum+');"></td></tr></table></span>';
   jQuery('#itemRows').append(row);
}

function removeRow(rnum) {
  jQuery('#rowNum'+rnum).remove();
}
4

1 回答 1

0

您的 cloneMe 代码始终在克隆 ID 为“container1”的隐藏表单模板。如果您希望它在添加额外的支撑和数量行后克隆一个表单，您需要将正确的元素传递给 cloneMe 函数。由于第一个容器的 id 为“container”而不是“container1”，因此您的 cloneMe 调用需要：

cloneMe($('#container'))

当然，这不是动态的。这将始终克隆顶部容器。如果你想克隆列表中的最新容器，这就是你想要的，你需要你的“更多详细信息”按钮更加动态，如下所示：

<input type="button" id="cloneb" value="More Details" onclick="cloneMe($('#container' + (newNum - 1)));" />

这将始终克隆当前 newNum 变量之前的数字。您可能应该取消您的“container1”隐藏模板，只需调用您的第一个容器“container1”。否则，onclick 更改将不起作用，因为它仍会克隆您的隐藏容器，而不是您添加新行的第一个容器。

于 2013-10-19T09:42:22.267 回答