提交表单后，向表中添加新行.-JQuery，阿贾克斯

Question

我正在使用ajax.beginform，并在提交表单后在我的控制器中调用json对象来呈现表单对象。我想插入一个新的表行，用于从数据库中获取数据。 正确的方法是什么？ 我需要jquery函数的帮助。 这是我的代码。

视图

@using (Ajax.BeginForm("SubmitForm", "Controller", null, new AjaxOptions
        {
            HttpMethod = "POST",
            OnSuccess = "RenderObjectsAfterSubmit(data);"
        }))
{ 
<div>Request # <span id="ID"></span></div>
<div>
    @Html.Label("Name")
    <div>
        @Html.TextBoxFor(model => model.Name)
    </div>
</div>
<button type="submit" id="btnSubmit">Submit</button>
<table id="myTable">
    <thead>
        <tr>
            <th>Name</th>
        </tr>
    </thead>
    <tbody>
        @foreach (var item in Model)
        {
            <tr>
                <td>@item.Name</td>
            </tr>
        }
    </tbody>
</table> 
}

Jquery Function

function RenderObjectsAfterSubmit(data) {
    if (data != null && data.model != null) {
        $("#ID").html(data.model.Id);
        $("<tr><td>$('#Name').html(data.model.Name);</td> </tr>").insertAfter("#myTable");  **Here is where I need help.**
    }
    onSuccess(data, '', '#ajaxresult', '', '#btnSubmit');
}

控制器

public ActionResult SubmitForm(Model model)
{
if (ModelState.IsValid)
{
    try
    {
        return Json(new
        {
            success=true,
            model=model
        });
    }
}
}

Answer 1

试试这个。

$("<tr><td>"+$('#Name').text()+"</td> </tr>").appendTo("#myTable");

Answer 2

in onsuccess function

尝试

$("#myTable").append("<tr><td>"+$('#Name').val()+"</td> </tr>");

Answer 3

我必须改变我做事的方式。 我只需向OnSuccess函数添加一个Id即可使其工作。所以，它看起来像这样。

成功（数据， '#myTable'， '#ajaxresult'， ''

， '#btnSubmit'）;