在asp.net mvc中对控制器进行简单的Ajax调用
我试图开始使用ASP.NET MVC Ajax调用。
控制器:
public class AjaxTestController : Controller { // // GET: /AjaxTest/ public ActionResult Index() { return View(); } public ActionResult FirstAjax() { return Json("chamara", JsonRequestBehavior.AllowGet); } }
视图:
<head runat="server"> <title>FirstAjax</title> <script src="http://code.jquery.com/jquery-1.9.1.js"></script> <script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script> <script type="text/javascript"> $(document).ready(function () { var serviceURL = '/AjaxTest/FirstAjax'; $.ajax({ type: "POST", url: serviceURL, data: param = "", contentType: "application/json; charset=utf-8", dataType: "json", success: successFunc, error: errorFunc }); function successFunc(data, status) { alert(data); } function errorFunc() { alert('error'); } }); </script> </head>
我只需要用控制器方法返回数据来打印警报。 上面的代码只是在我的视图上打印“chamara”。 警报不会触发。
UPDATE
我修改了我的控制器,如下所示,它开始工作。 我不清楚为什么它现在正在工作。 有人请解释一下。 参数“a”不相关我添加它,因为我不能添加两个具有相同的方法名称和参数的方法。我认为这可能不是解决scheme,但它的工作
public class AjaxTestController : Controller { // // GET: /AjaxTest/ [HttpGet] public ActionResult FirstAjax() { return View(); } [HttpPost] public ActionResult FirstAjax(string a) { return Json("chamara", JsonRequestBehavior.AllowGet); } }
更新完成后,
- 它首先使用默认的HttpGet请求调用FirstAjax动作并呈现空白的Html视图。 (之前你没有)
- 稍后加载该视图的DOM元素时,您的Ajax调用会被触发并显示警报。
此前你只是返回JSON到浏览器,而不呈现任何HTML。 现在它已经呈现了一个HTML视图,它可以获取你的JSON数据。
您不能直接呈现JSON其纯数据而不是HTML。
删除数据属性,因为你没有向服务器发送任何东西(你的控制器不期望任何参数)。
而在您的AJAX方法中,您可以使用Razor
并使用@Url.Action
而不是静态string:
$.ajax({ url: '@Url.Action("FirstAjax", "AjaxTest")', contentType: "application/json; charset=utf-8", dataType: "json", success: successFunc, error: errorFunc });
从你的更新:
$.ajax({ type: "POST", url: '@Url.Action("FirstAjax", "AjaxTest")', contentType: "application/json; charset=utf-8", data: { a: "testing" }, dataType: "json", success: function() { alert('Success'); }, error: errorFunc });
使用Razor通过调用您的动作来dynamic更改您的URL:
$.ajax({ type: "POST", url: '@Url.Action("ActionName", "ControllerName")', contentType: "application/json; charset=utf-8", data: { data: "yourdata" }, dataType: "json", success: function(recData) { alert('Success'); }, error: function() { alert('A error'); } });
这是你的更新问题。
既然你不能有两个具有相同名字和签名的方法,你必须使用ActionName属性:
更新:
[HttpGet] public ActionResult FirstAjax() { Some Code--Some Code---Some Code return View(); } [HttpPost] [ActionName("FirstAjax")] public ActionResult FirstAjaxPost() { Some Code--Some Code---Some Code return View(); }
请参阅此链接进一步参考如何方法成为一个行动。 虽然很好的参考。
首先,不需要在一个页面中有两个不同版本的jquery库,“1.9.1”或“2.0.0”足以使ajax调用工作。
这里是你的控制器代码:
public ActionResult Index() { return View(); } public ActionResult FirstAjax(string a) { return Json("chamara", JsonRequestBehavior.AllowGet); }
这是你的观点应该是这样的:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script> <script type="text/javascript"> $(document).ready(function () { var a = "Test"; $.ajax({ url: "../../Home/FirstAjax", type: "GET", data: { a : a }, success: function (response) { alert(response); }, error: function (response) { alert(response); } }); }); </script>
如果你只需要在你的Ajax调用中打C#方法,那么你只需要传递两个事物types和url,如果你的请求是get,那么你只需要指定url。 请按照下面的代码工作正常。
C# Code [HttpGet] public ActionResult FirstAjax() { return Json("chamara", JsonRequestBehavior.AllowGet); } Java Script Code if Get Request $.ajax({ url: 'home/FirstAjax', success: function(responce){ alert(responce.data)}, error: function(responce){ alert(responce.data)} }); Java Script Code if Post Request and also [HttpGet] to [HttpPost] $.ajax({ url: 'home/FirstAjax', type:'POST', success: function(responce){ alert(responce)}, error: function(responce){ alert(responce)} });
注意:如果你的FirstAjax在同一个控制器中,你的View Controller不需要URL中的控制器名称。 像url: 'FirstAjax',
而不是url: serviceURL,
使用
url: '<%= serviceURL%>',
你是否传递2个参数到successFunc?
function successFunc(data) { alert(data); }
在global.asax中添加“JsonValueProviderFactory”:
protected void Application_Start() { AreaRegistration.RegisterAllAreas(); ValueProviderFactories.Factories.Add(new JsonValueProviderFactory()); }
视图;
$.ajax({ type: 'GET', cache: false, url: '/Login/Method', dataType: 'json', data: { }, error: function () { }, success: function (result) { alert("success") } });
控制器方法;
public JsonResult Method() { return Json(new JsonResult() { Data = "Result" }, JsonRequestBehavior.AllowGet); }