javascript - 表单在 Bootstrap 模式表单内提交以执行appendTo html表

Question

这是演示，这是演示 ttp://jsfiddle.net/2GfhF/7

表单操作错误？当我在本地主机上尝试时，来自 from 的 val 在新行中显示，但随后消失。有溶胶吗？

Answer 1

您好，您必须在表单提交上添加return false，因为它会重新加载页面。

或者您可以在 .appendTo() 调用后添加以下代码

$('.form-actions button[type="button"]').trigger('click');//to close modal

    return false;// stop page to reload

新更新的完整脚本

$("#save_add_new_row").click(function () {
    var $tr = $('<tr />');
    $tr.append($("<td />", {
        text: $("#category_selection_list").val()
    }));
    $tr.append($("<td />", {
        text: $("#curriculum_name").val()
    }));
    $tr.append($("<td />", {
        text: $("#curriculum_textarea").val()
    }));
     if($("#checkbox_status").prop('checked') == true){
    $tr.append("<td style='text-align:center;' class='label-success' >Active</td>");
    }else{
        $tr.append("<td style='text-align:center;' class='label-danger' >Inactive</td>");

    }
    //$tr.append($("<td />", { text: $(".test5:checked").val() }))
    $tr.appendTo($("#sample_editable_1"));
$('.form-actions button[type="button"]').trigger('click');//to close modal

    return false;
});