0

我在 MS MVC [razor] 项目中有一个视图，我想通过 JSON 发布操作将视图数据提交回控制器。我环顾四周，找不到如何检索和打包视图数据以提交回控制器。我假设 JSON 序列化操作会在调用时打包数据，但这似乎没有发生。例如：

MVC 视图 ------------------

@using (Html.BeginForm()) 
   {
    @Html.AntiForgeryToken()
    @Html.ValidationSummary(true)

    <center>
        <fieldset  id="UserCreateFieldset">
            <div class="editor-label">
                @Html.LabelFor(model => model.FirstName)
            </div>
            <div class="editor-field">
                @Html.EditorFor(model => model.FirstName)
                @Html.ValidationMessageFor(model => model.FirstName)
            </div>

            <p>
                <input type="button" name="CreateButton" value="Create"  onclick="CreateUser()"   />
            </p>                                    
        </fieldset>
    </center>
   }

   <script>

    function CreateUser()
    {
        var infoForm = $("#UserCreateFieldset");
        var entries = infoForm.serializer.Serialize(Model);

        $.ajax(
                    {
                        url: '@Url.Action("CreateUser", "User")',
                        data: entries,
                        type: "POST",
                        dataType: "json",
                        success: function (data)
                        {
                            $.event.trigger({
                                type: "CreateUserCompleted",
                                NewUserID: 1,
                            });
                        }
                    });               
    }
   </script>

只是要注意; 当通过帖子调用控制器时，它会接收回模型——但它包含用于加载视图的原始值。

彼得

4

1 回答 1

0

使用 jquery 中的.serialize()方法：

function CreateUser()
{
    var data = $('form').serialize();

    $.ajax({
        url: '@Url.Action("CreateUser", "User")',
        data: data,
        type: "POST",
        dataType: "json",
        success: function (data)
        {
            $.event.trigger({
                type: "CreateUserCompleted",
                NewUserID: 1,
            });
        }
    });               
}

如果您正在做与 a 相同的事情而没有任何特别之处，您可以代替使用Html.BeginFormuse来不弄乱内部结构。您可以将代码更改为：Ajax.BeginFormHtml.BeginForm

@using(Ajax.BeginForm("MyAction", "MyController",
            new AjaxOptions
            {
                HttpMethod = "POST"
            }))
{
    // Same form
}

它甚至有可以在声明中使用的OnSuccessAjaxOptions方法：

@using(Ajax.BeginForm("MyAction", "MyController",
            new AjaxOptions
            {
                HttpMethod = "POST",
                OnSuccess = "TriggerEvent"
            }))
{
    // Same form
}

并且您在 javascript 中设置了一个函数以在成功时调用：

function TriggerEvent() {
    $.event.trigger({
        type: "CreateUserCompleted",
        NewUserID: 1,
    });
}
于 2013-08-04T15:49:30.373 回答