ASP.NET MVC AJAX表單提交例項
阿新 • • 發佈:2019-02-05
1.首先,新建一個controller。
using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.Mvc; namespace MvcApplication1.Controllers { public class AJAXController : Controller { // // GET: /AJAX/ public ActionResult Index() { return View(); } } }
2.在index方法下,右鍵,新增檢視
3.在Index.cshtml,建立一個ajax的表單。
這是cshtml的內容,這裡有幾個要注意的地方。@{ ViewBag.Title = "Index"; } <script src="~/Scripts/jquery-3.1.1.js"></script> <script src="~/Scripts/jquery.unobtrusive-ajax.js"></script> <h2>Index</h2> @using (Ajax.BeginForm("hello", "AJAX", new AjaxOptions() { HttpMethod = "post",UpdateTargetId = "information",InsertionMode = InsertionMode.Replace })) { <input type="text" name="name"> <input type="submit" id="btnAjax" name="btnAjax" value="提交" /> } <div id="information"></div>
1.一定要注意jquery.js一定要放在最前面,不然的話,將會出現不能非同步的情況。
2.說明一下ajax.beginform中的引數的意義:
1.“hello”指的是controller中的方法。
2.“AJAX”指的是我們剛才建立的controller。
3.HttpMethod = "post"指的是用post傳輸。
4.UpdateTargetId = "information"指的是傳來的內容在哪裡顯示,我們上面的程式碼中最下面有一個div,id=“information”,值得就是他。
5.InsertionMode = InsertionMode.Replace指的是替換。
4.完成hello方法
[HttpPost]
public ActionResult GetTime(string cal)
{
//return Content(DateTime.Now.ToString("F"));
string x2 = "的預警資訊暫無";
string x3 = cal + x2;
return Content(x3);
}
這樣整個的程式碼就寫好了。
我們來看一下效果:
輸入名字,點選提交,頁面不會跳轉
這樣一個簡單的表單提交就完成了。