用jquery ajax和MVC3發佈表單的正確方法是什麼？

我見過幾種如何做到這一點的方法。我自己的方法，我想，除了從一個部分，如下：形式用jquery ajax和MVC3發佈表單的正確方法是什麼？

劫持提交事件
收集數據，建立一個json對象
```
var objToSend = { Property : $('#propertyField').val(), Property2 : ... }; 
```
這是第一部分我不喜歡，因爲收集這樣的25個值非常繁瑣
調用$.ajax({})並指定url指向[HttpPost]啓用的操作某處
成功：ajax-query的一部分，收集返回的數據（我將它作爲字符串返回），並在適當的地方寫出來。我也在這裏處理錯誤，檢查第一個單詞是否是「Error：」，然後採取適當的措施。

我喜歡這種方法，除了收集階段。我相信有這樣做的更好的方法，但我把自己投入jquery來自一個ASP.NET WebForms背景，所以整個「擁抱網絡」部分對我來說是完全陌生的。

2011-08-08 Phil

您可以使用serialize()方法來避免逐個傳遞所有字段。它將整個表單數據發送到使用application/x-www-form-urlencoded內容類型的服務器，就好像它是一個標準的形式提交：

$('#myform').submit(function() { 
    $.ajax({ 
     url: this.action, 
     type: this.method, 
     data: $(this).serialize(), 
     success: function(result) { 
      // TODO: handle the success case 
     }  
    }); 
    return false; 
});

另一種可能性是jQuery form plugin：

$('#myform').ajaxForm(function(result) { 
    // TODO: handle the success case 
});

有些人覺得它也是有用的使用Ajax.BeginForm傭工來渲染表單：

@using (Ajax.BeginForm(new AjaxOptions { OnSuccess = "success" })) 
{ 
    ... some input fields 
}

在ASP.NET MVC 3，你需要包括jquery.unobtrusive-ajax.js腳本不顯眼地AJAX化由Ajax助手發出的HTML 5 data-*屬性。

來源

2011-08-08 13:13:50

我將如何在控制器操作中處理.serialize創建的對象？它是否將輸入ID，名稱和設置爲對象中輸入字段值的名稱？ – Phil

@Phil，與任何標準表單提交一樣：您將定義包含映射到輸入字段的屬性的視圖模型，並且您將使POST控制器操作將此視圖模型作爲參數。默認模型聯編程序將負責正確填充它。 –

這就是我該怎麼做的！

如果您正在處理表單等，您也可以選擇使用MVC幫助程序爲您創建郵政代碼處理代碼。

<% using (html.BeginForm()) {%> 

    // html for the form 


    <input type='submit' value='post' /> 

<% } %>

從WebForms的MVC的過渡可以是一個棘手的一個人擁有你真的是在處理Web編程，即使用HTTP，HTML和JavaScript的原料方面......順便說一句，我相信這是一件好事因爲我不是WebForms的僞單進程事件模型的粉絲。

萬歲MVC！ :)

來源

2011-08-08 13:14:11

允許jQuery爲您構建您的json。您可以序列化一個表單，它將創建一個數據集供您提交。

$.post("myUrl", 
     $("form").serialize(), 
     function(callback) { ... } 
    );

來源

2011-08-08 13:14:34

工作。這很棒！！！ –

我傾向於使用「jQuery表單插件」。它可以徹底抽象的一個標準形式爲AJAX形式，用很少的努力：

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

它也可以讓你輕鬆地捕獲各種事件，故障情況，驗證等，並可以將表格轉換爲一個JSON請求或XML，如果你願意。也處理文件上傳。

來源

2011-08-08 13:15:55 Deleted

用jquery ajax和MVC3發佈表單的正確方法是什麼？

回答

相關問題