从ajax发布MVC Razor表单

Iti*_*eer 1 ajax asp.net-mvc jquery html-helper razor

在部分视图中,有一个使用Html.Helper类(TextBoxFor,DropDownListFor等)的表单(@addName).

@model Models.ADP

using (@Html.BeginForm(new { id= @addName}))
{
    @Html.TextBoxFor(model => model.EndValue, new { id = @newName, size = "5", style = "margin-right: 10px" })
    @Html.HiddenFor(model => model.ModuleTypeId, new { @Value = @ViewBag.ModuleId }
    @Html.DropDownListFor(model => model.DPId, @dpList, "Choose an Option...", new { @class = "select" })
}
Run Code Online (Sandbox Code Playgroud)

我拦截提交以便异步发布和检索新数据,divId是整个部分视图的div.

    $('#@saveName').click( function (event) {
        event.preventDefault();
        $.ajax({
            url: '@Url.Action("SaveADP", "Dispense")',
            type: 'POST',
            data: $('#@addName').serialize(),
            success: function (data) {
                $('#@divId').html(data);
            }
        })
    })
Run Code Online (Sandbox Code Playgroud)

正在调用SaveADP操作,但是唯一具有设置值的字段是EndValue,其他字段(ModuleTypeId和DPId)具有默认值而不是其表单值.我在这做错了什么?

nav*_*een 7

ASP.NET MVC不可知的方法是为每个元素提供id,然后将其作为JSON传递给控制器​​.作为它的一部分,它将更适合您的需要,因为响应可以在ajax请求的回调上获取.

var DTO = {
    newDP: {
        StartValue: $("#id_of_elm").val(),
        EndValue: $("#newName").val(),
        Duration: $("#id_of_elm").val(),
        ModuleTypeId: $("#id_of_elm").val(),
        DPId: $("#id_of_elm").val()
    }
};

$('#saveName').click(function (event) {
    event.preventDefault();
    $.ajax({
        contentType: 'application/json'
        data: JSON.stringify(DTO),
        type: 'POST',
        url: '@Url.Action("SaveADP", "Dispense")'
    }).done(function (data) {
        $('#divId').html(data);
    });
});
Run Code Online (Sandbox Code Playgroud)

不相关但重要的一点

  1. 请使用#saveName替代#@saveName#divId取代#@divId
  2. 请注意,这jqXHR.done()是处理成功回调的新方法$.ajax