Question

我正在使用ASP.NET Mvc来显示一个包含几个输入字段的JQuery对话框。我现在需要将这些字段提交给一个动作方法，就像普通的HTML提交按钮如何在ASP .NET MVC应用程序上工作，我想在对话框中收集数据到Mvc控制器。我该如何做到这一点？

这是我的数据表格

<% Html.BeginForm("EditTest", "Item"); %>
           <table>
             <tr>
               <td><b>ItemId</b></td>
               <td><input id="ItemId" name="ItemId" type="text" disabled="disabled" /></td>
             </tr>
               <tr>
               <td><b>CatId</b></td>
               <td><input id="CatId" name="CatId" type="text" />
                   <%--<%= Html.DropDownList("CatId", ViewData["AllCategory"] as SelectList)%>--%></td>
             </tr>
               <tr>
               <td><b>SaleOffId</b></td>
               <td><input id="SaleOffId" name="SaleOffId" type="text"/></td>
             </tr>
               <tr>
               <td><b>UnitId</b></td>
               <td><input id="UnitId" name="UnitId" type="text" /></td>
             </tr>
               <tr>
               <td><b>ItemCode</b></td>
               <td><input id="ItemCode" name="ItemCode" type="text" /></td>
             </tr>
               <tr>
               <td><b>ItemName</b></td>
               <td><input id="ItemName" name="ItemName" type="text" /></td>
             </tr>
               <tr>
               <td><b>UnitCost</b></td>
               <td><input id="UnitCost" name="UnitCost" type="text"/></td>
             </tr>
               <tr>
               <td><b>QuantityRemaining</b></td>
               <td><input id="QuantityRemaining" name="QuantityRemaining" type="text"/></td>
             </tr>
           </table>
        <% Html.EndForm(); %>

和我的剧本

$(function() {
        $("#dialog").dialog({
            bgiframe: true,
            autoOpen: false,
            height: 300,
            modal: true,
            buttons: {
                "Save": function() {
                    var id = $("#ItemId").val(),
                    catid = $("#CatId").val(),
                    unitid = $("#UnitId").val(),
                    saleoffid = $("#SaleOffId").val(),
                    name = $("#ItemName").val(),
                    code = $("#ItemCode").val(),
                    price = $("#UnitCost").val(),
                    stock = $("#QuantityRemaining").val();

                    $("#dialog form").attr("post", "/Item.aspx/EditTest/" + $("#ItemId").val());

                    $(this).dialog('close');

                },
                Cancel: function() {
                    $(this).dialog('close');
                }
            },
            close: function() {
                allFields.val('').removeClass('ui-state-error');

            }
        });

Answer 1

在jQuery中使用serialize（）函数：

    $.post("myAction",$("#myForm").serialize(), 
        function(response) {alert(response);});

然后在控制器方法中使用默认模型绑定器：

public ActionResult fooAction(MyObject myObject){
    //update your object
}

如果输入字段的名称类似于“myObject.Name”，它将自动绑定它们。

如果您需要为非形式的容器序列化输入字段 - 请使用this jQuery插件。

如果您正在寻找更复杂的方法 - 我建议您check MvcContrib。

编辑：
关于约束的Another nice article。

Answer 2

你可以使用jQuery Form插件：

http://malsup.com/jquery/form/

并致电


$('#dialog form').ajaxForm(options);

只会对EditTest控制器进行常规发布...而且您不需要将每个字段都读入javascript vars

如何在jquery对话框中将数据收集到Mvc Controller？

2 个答案: