JQuery通過(guò)Ajax提交表單并返回結(jié)果
1:非Ajax
前臺(tái):
對(duì)應(yīng)后臺(tái):
2:JQuery之Ajax
在介紹使用JQuery提交表單前,我們需要首先引用jquery.form.js,它來(lái)自于http://www.malsup.com/jquery/form/,至此,我們需要引用的JS文件有:
功能要求:Ajax提交表單,在控制器HelloWorld4Controller中處理請(qǐng)求,并返回若干數(shù)據(jù),數(shù)據(jù)格式為JSON。
首先,我們假設(shè)返回的JSON實(shí)體為:
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();
}
}
}
上面的代碼告訴我們,如果我們想要返回別的實(shí)體,也是很方便的的。
前臺(tái)部分代碼:
如果按鈕不使用submit,而是button,則上圖代碼換成如下形式:
源碼下載:MvcApplication5.zip
- jquery實(shí)現(xiàn)ajax提交表單信息的簡(jiǎn)單方法(推薦)
- jquery ajax提交表單數(shù)據(jù)的兩種方式
- jquery實(shí)現(xiàn)ajax提交form表單的方法總結(jié)
- jQuery使用ajaxSubmit()提交表單示例
- JQuery打造PHP的AJAX表單提交實(shí)例
- jQuery ajax中使用serialize()方法提交表單數(shù)據(jù)示例
- jquery序列化form表單使用ajax提交后處理返回的json數(shù)據(jù)
- jquery下異步提交表單 異步跨域提交表單
- jQuery實(shí)現(xiàn)form表單基于ajax無(wú)刷新提交方法詳解
- jquery表單提交帶錯(cuò)誤信息提示效果
相關(guān)文章
jQuery實(shí)現(xiàn)Table表格隔行變色及高亮顯示當(dāng)前選擇行效果示例
這篇文章主要介紹了jQuery實(shí)現(xiàn)Table表格隔行變色及高亮顯示當(dāng)前選擇行效果,涉及jQuery針對(duì)table元素遍歷、運(yùn)算、樣式及鼠標(biāo)事件動(dòng)態(tài)響應(yīng)相關(guān)操作技巧,需要的朋友可以參考下2017-02-02Jquery實(shí)現(xiàn)仿騰訊娛樂頻道焦點(diǎn)圖(幻燈片)特效
這篇文章主要介紹了Jquery實(shí)現(xiàn)仿騰訊娛樂頻道焦點(diǎn)圖(幻燈片)特效,需要的朋友可以參考下2015-03-03jquery 多行滾動(dòng)代碼(附詳細(xì)解釋)
在網(wǎng)上可以隨處找到這段代碼,但是沒有任何人解釋這段代碼,只要自己研究好久。2010-06-06ASP.NET jQuery 實(shí)例12 通過(guò)使用jQuery validation插件簡(jiǎn)單實(shí)現(xiàn)用戶注冊(cè)頁(yè)面驗(yàn)證功能
在這節(jié)我們將使用validation插件實(shí)現(xiàn)注冊(cè)頁(yè)面的驗(yàn)證功能,通過(guò)這個(gè)例子,可以更全面的掌握該插件的使用功能2012-02-02擴(kuò)展Jquery插件處理mouseover時(shí)內(nèi)部有子元素時(shí)發(fā)生樣式閃爍
在我們對(duì)一個(gè)dom添加mouseover和mouseout時(shí),也就是jquery的hover事件,如果該dom有子元素,鼠標(biāo)移到子元素時(shí)會(huì)觸發(fā)mouseout事件,但往往實(shí)際情況我們希望在子元素上不觸發(fā)out事件2011-12-12基于jquery實(shí)現(xiàn)的表格分頁(yè)實(shí)現(xiàn)代碼
該方法的運(yùn)用是從后臺(tái)數(shù)據(jù)庫(kù)中一次性取出所有的數(shù)據(jù),運(yùn)用Jquery把一部分?jǐn)?shù)據(jù)隱藏起來(lái),事實(shí)上數(shù)據(jù)還是全部在html頁(yè)面中2011-06-06jQuery模擬Marquee實(shí)現(xiàn)無(wú)縫滾動(dòng)效果完整實(shí)例
這篇文章主要介紹了jQuery模擬Marquee實(shí)現(xiàn)無(wú)縫滾動(dòng)效果,結(jié)合完整實(shí)例形式分析了jQuery針對(duì)圖片與文字的無(wú)縫滾動(dòng)效果實(shí)現(xiàn)技巧,需要的朋友可以參考下2016-09-09jquery 點(diǎn)擊元素后,滾動(dòng)條滾動(dòng)至該元素位置的方法
下面小編就為大家?guī)?lái)一篇jquery 點(diǎn)擊元素后,滾動(dòng)條滾動(dòng)至該元素位置的方法。小編覺得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2016-08-08