Question

大家好，这可能是一个非常愚蠢的错误但是我使用jquery将一个formset添加到一个页面它还做了其他的事情，比如更新表单的数量，但这似乎不是问题。

$(document).ready(function () {
function updateElementIndex(el, prefix, ndx) {
    var id_regex = new RegExp('(' + prefix + '_set-\\d+-)');
    var replacement = prefix + '_set-' + ndx + '-';
    if ($(el).attr("for")) $(el).attr("for", $(el).attr("for").replace(id_regex, replacement));
    if (el.id) el.id = el.id.replace(id_regex, replacement);
    if (el.name) el.name = el.name.replace(id_regex, replacement);
}

function changeDeleteForms(el, prefix, formid) {
    var idstring = 'id_' + prefix + '_set-' + formid + '-DELETE';
    //$('<input>').attr({type: 'hidden', id: 'id_' + idstring, name: idstring}).appendTo('.command-delete');
    $('#' + idstring).prop('checked', true);
}

function deleteForm(btn, prefix) {
    var formCount = parseInt($('#id_' + prefix + '_set-TOTAL_FORMS').val());
    if (formCount > 1) {
        // Delete the item/form
        $(btn).parents('.command').hide();
        $(btn).parents('.command').attr('class', 'command-delete');
        var dc = $(".command-delete");
        $(dc).children().children().children().each(function () {
            var formid = this.id.match(/\d+/g);
            changeDeleteForms(this, prefix, formid);
            //$(this).val("");
        });
        var forms = $('.command'); // Get all the forms
        var formsdelete = $('.command-delete'); // Get all the forms 
        var fl = parseInt(forms.length);
        var fdl = parseInt(formsdelete.length);
        var finalcount = fl + fdl
        // Update the total number of forms (1 less than before)
        //$('#id_' + prefix + '_set-TOTAL_FORMS').val(forms.length);
        var i = 0;
    } // End if
    else {
        alert("Please enter atleast 1 command for this item.");
    }
    return false;
}

function addForm(btn, prefix) {
    var formCount = parseInt($('#id_' + prefix + '_set-TOTAL_FORMS').val());
    var maxCount = parseInt($('#id_' + prefix + '_set-MAX_NUM_FORMS').val());
    var forms = parseInt($('.command-delete').length); // Get all the forms 
    var newcount = formCount + forms;
    // You can only submit a maximum of 10 todo items
    if (newcount < maxCount) {
        // Clone a form (without event handlers) from the first form
        var row = $(".command:first").clone(false).get(0);
        // Insert it after the last form
        $(row).removeAttr('id').hide().insertAfter(".command:last").slideDown(300);

        // Remove the bits we don't want in the new row/form
        // e.g. error messages
        $(".errorlist", row).remove();
        $(row).children().removeClass("error");

        // Relabel or rename all the relevant bits
        $(row).children().children().children().children().each(function () {
            updateElementIndex(this, prefix, newcount);
            $(this).val("");
        });

        // Add an event handler for the delete item/form link 
        $(row).find(".delete").click(function () {
            return deleteForm(this, prefix);
        });
        // Update the total form count
        $("#id_" + prefix + "_set-TOTAL_FORMS").val(newcount + 1);
    } // End if
    else {
        alert("Sorry, you can only enter a maximum of 1000 items.");
    }
    return false;
}
// Register the click event handlers
$("#add").click(function () {
    return addForm(this, "itemcommands");
});

$(".delete").click(function () {
    return deleteForm(this, "itemcommands");
});

$('.command input:checkbox').hide();

});

如果你转到上面的链接，你可以看到代码工作得非常好，它更新了表单计数，并在id中添加了新的表单和新的编号，然而当你点击第一个的添加命令按钮时生产中的所有内容它没有显示3次，但代码已进入页面，表格在技术上已经存在但未显示。

第四次按下它按钮时，该行已在元素中的最后一个（'。命令'）之后添加。

什么可能导致它在JSFiddle上工作而不在生产上？

------------------- UPDATE -------------------------- < / p>

似乎如果我删除3中隐藏的溢出，当你按下按钮前3次时它会显示在正确的位置。

为什么溢出不会从前3个表单行中删除，但其余的会在罚款之后删除？

---------------------- UPDATE ------------------------ - 我觉得我发现了这个问题，它与JQUERY无关，似乎是bootstraps响应式布局隐藏表单我认为如果我将它们专门添加到他们自己的行中我可以解决这个问题。

感谢你们的帮助。

Answer 1

我的文件中没有src="*jQuery source*"。由于JSFiddle已经将源添加到文件中，您可能忘记将其放入。

Jquery添加表单，适用于JSFiddle，但在生产中没有

1 个答案: