使用ajax向表中添加新行

时间:2015-02-12 10:40:59

标签: javascript asp.net ajax

我有点问题。事实是,我意识到每次添加一行时,都会考虑其他添加。即,如果我添加一行,确定,插入下方单击。但是如果我想在新的下面添加,它实际上会添加两行等等。有帮助吗?这是我的代码

<script>


$(".insertRow").live('click', function () {

    var vref = '@Url.Action("RecordEntryRow", "Layout")';
    var obj = this;
    $.ajax({
        url: vref,
        cache: false,
        success: function (html) {
            var u = $(obj).parents(".record:first.")[0];
            $(u).after(html);
        }
    });
    return false;

});

2 个答案:

答案 0 :(得分:0)

我已根据您编辑的问题进行了测试。 一切都按预期工作:

<!doctype html>
<html>
    <head>
        <title>Test</title>
        <script type="text/javascript" src="http://code.jquery.com/jquery-1.11.2.min.js"></script>
        <script type="text/javascript">
            $(document).ready(function() {
                var i = 0;
                $(document).off('click', '#td').on('click', 'td', function(e) {
                    $(this).parent().after('<tr><td>Append ' + i + '</td></tr>');
                    i++;
                    e.preventDefault();
                });
            });
        </script>
    </head>
    <body>
        <table>
            <tr>
                <td id="td" style="border: 1px solid red;">
                    Test
                </td>
            </tr>
        </table>
    </body>
</html>

答案 1 :(得分:0)

<tr class ="record">

@using (Html.BeginCollectionItem("Records")) { 


    <td> @Html.DropDownListFor(model => model.Type, new List<SelectListItem>{
                                                    new SelectListItem() {Text = "titre en gras", Value="Titre_Gras"},
                                                    new SelectListItem() {Text = "titre normal", Value="Titre_Normal"},
                                                    new SelectListItem() {Text = "titre minime", Value="Titre_Minime"},
                                                    new SelectListItem() {Text = "titre italique", Value="Titre_Italique"},
                                                    new SelectListItem() {Text = "item", Value="Item"},
                                                    new SelectListItem() {Text = "Separateur", Value="Separateur"},
                                                    }) </td>
    <td> @Html.EditorFor(model => model.Contenu) </td>
    <td> <a href="#" onclick="$(this).closest('tr').remove();"><img src="~/Content/images/red-delete-button.jpg" width="25" height="25" /></a></td>
    <td> <a href="#" class="insertRow" ><img src="~/Content/images/add_button.png" width="20" height="20" /></a> </td>

}