Source Code reference: Link: http://pan.baidu.com/s/1pKhHHMj Password: MKR4
1: New--Project-->web-->asp.net MVC 4 Web application. Named as: Mvc4jqueryajaxdemo
2: New controller: Right-click on the Controllers folder and add the controller, named: HomeController (HomeController. cs)
3: Added Action:getdate () in controller HomeController
1 usingSystem;2 usingSystem.Collections.Generic;3 usingSystem.Linq;4 usingsystem.web;5 usingSYSTEM.WEB.MVC;6 7 namespacemvc4jqueryajaxdemo.controllers8 {9 Public classHomecontroller:controllerTen { One // A //GET:/home/ - - Publicactionresult Index () the { - returnView (); - } - + Publicactionresult GetDate () - { + returnContent (DateTime.Now.ToString ()); A } at - } -}
HomeController.cs
4: New View: Right--add view name on HomeController action:index: Index (Default and Action name consistent) (index.cshtml)
5: Add the following code to the view index, using the AJAX request script provided by Microsoft, as follows:
5.1: Add Reference to Jquery-1.8.2.min.js
1 @{2 Layout = null;3 }4 5 <!DOCTYPE HTML>6 7 <HTML>8 <Head>9 <Metaname= "Viewport"content= "Width=device-width" />Ten <title>Index</title> One <Scriptsrc= "~/scripts/jquery-1.8.2.min.js"></Script> A <Script> - $(function () { - $("#btnJQ"). Click (function () { the $.ajax ({ - URL:"/home/getdate", - Type:"POST", - Success:function(data) {alert (data);}, + Data:"id=111&name=222" //test Data - }); + A //another Ajax post at $.post ("/home/getdate", "", function(data) {alert (data);}); - }); - }); - </Script> - </Head> - <Body> in <Div> - <H1>MVC 4 JQuery Ajax Demo</H1> to <inputtype= "button"ID= "BTNJQ"name= "BTNJQ"value= "Getserverdate" /> + </Div> - </Body> the </HTML>
index.cshtml
6: Compile, Run page default is/home/index
6.1: Click getserverdate button to appear the following page
MVC4 Ajax under AspNet MVC/using jquery to make related AJAX requests