1

在我的项目中，我使用 django 内联表单集。我得到了 jquery 来克隆表单集，但不幸的是，克隆的表单具有相同的名称和 id，因此在最后一个表单中输入的数据会覆盖第一个表单中的数据。我可能做错了什么？

这是脚本：

<script type="text/javascript">>
function cloneMore(selector, type) {
    var newElement = $(selector).clone(true);
    var total = $('#id_' + type + '-TOTAL_FORMS').val();
    newElement.find(':input').each(function() {
        var name = $(this).attr('name').replace('-' + (total-1) + '-','-' + total + '-');   
        var id = 'id_' + name;
        $(this).attr({'name': name, 'id': id}).val('').removeAttr('checked');
    });
    newElement.find('label').each(function() {
        var newFor = $(this).attr('for').replace('-' + (total-1) + '-','-' + total + '-');  
        $(this).attr('for', newFor); 
    }); 
    total++;
    $('#id_' + type + '-TOTAL_FORMS').val(total);
    $(selector).after(newElement);
}

</script>
4

2 回答 2

1

我将 CloneMore.js 脚本用于相同目的（此时我的版本已修改）。我不知道您是否属于这种情况，但是如果您有任何被 javascript 修改的字段，则需要重新初始化该字段。例如，uniform.js 选择器、日期选择器或任何自动完成字段可能需要重置。

这是我点击克隆按钮时处理其中一些问题的代码片段。另请注意，这些都在live()

// #add_more is my button to add a formset
$('#add_more').live('click',function() { 
    cloneMore('div.line_item:last', 'lineitem');
    $(".line_item:last").find('.hasDatepicker').each(function() {
        // remove then initialize datepicker
        $(this).removeClass("hasDatepicker").datepicker( {dateFormat:'mm/dd/yy'} );
    });
    $(".line_item:last").find('.autocomplete_field').each(function() {
        // remove then initialize autocomplete
        $(this).autocomplete('destroy');
        // enable_autocomplete is a custom function, but it's basically just 
        // $(this).autocomplete({ options... })
        enable_autocomplete($(this), cust_part_url);
    });
});

编辑：我认为这个SO Answer是 cloneMore 脚本的起源

于 2012-05-30T16:25:14.100 回答
1

django formset 中的每个表单都提供了唯一的 name 属性，它充当 django 的一种 id，这意味着如果您在 formset 中克隆第一个表单，这意味着您还将克隆它的 id，因此克隆它将覆盖第一个形式。

您可以使用/克隆Baseformset提供的 empty_form，{{form.empty_form}}为其提供适当的名称并更新-TOTAL_FORMS

于 2012-05-30T13:07:48.520 回答