MVC TIP3：JQuery通過Ajax送出表單并傳回結果

在開始介紹使用JQuery送出表單之前，先看一下非Ajax送出表單的形式，如下：

1：非Ajax

前台：

對應背景：

2：JQuery之Ajax

在介紹使用JQuery送出表單前，我們需要首先引用jquery.form.js，它來自于

http://www.malsup.com/jquery/form/ ，至此，我們需要引用的JS檔案有：

功能要求：Ajax送出表單，在控制器HelloWorld4Controller中處理請求，并傳回若幹資料，資料格式為JSON。

首先，我們假設傳回的JSON實體為：

public class LoginResultDTO
        {
            public bool Success { get; set; }
            public string Message { get; set; }
            public string ReturnUrl { get; set; }
        }       

控制器部分的代碼為：

public class HelloWorld4Controller : Controller
    {
        public ActionResult Index()
        {
            if (Request.IsAjaxRequest())
            {
                string str1 = Request.Form["Text33"];
                string str2 = Request.Form["Text44"];
                return Json(new MvcApplication5.Controllers.HelloWorld3Controller.LoginResultDTO { Success = true, Message = str1 + str2, ReturnUrl = "SomeUrl" });
            }
            else
            {
                return View();
            }
        }
    }      

上面的代碼告訴我們，如果我們想要傳回别的實體，也是很友善的的。

前台部分代碼：

如果按鈕不使用submit，而是button，則上圖代碼換成如下形式：

源碼下載下傳：

MvcApplication5.zip

本文基于

Creative Commons Attribution 2.5 China Mainland License

釋出，歡迎轉載，演繹或用于商業目的，但是必須保留本文的署名

http://www.cnblogs.com/luminji

（包含連結）。如您有任何疑問或者授權方面的協商，請給我留言。