MVC makes doing AJAX calls simple. \u00a0As I have said before, I do not like the AJAX controls and methods that the Microsoft ships with the MVC platform. \u00a0I prefer to create my own AJAX methods instead of posting a AJAX form. \u00a0I find I can get better control and I can create tighter rules around elements of importance.<\/p>\n
The one thing I learned early is\u00a0when doing a Get Method, you need to ensure that you give permission to the AJAX call to return JSON by adding the following to your JSON return object:<\/p>\n
JsonRequestBehavior.AllowGet<\/code><\/pre>\nThis is an easy example of how to use your basic jQuery with your MVC Controller.<\/p>\n
<\/p>\n
This is my view:<\/strong><\/p>\n @{ \r\n Layout = null; \r\n } \r\n \r\n <!DOCTYPE html> \r\n \r\n <html> \r\n <head> \r\n <meta name=\"viewport\" content=\"width=device-width\" \/> \r\n <title>Test<\/title> \r\n <script src=\"~\/Scripts\/jquery-1.8.2.js\"><\/script> \r\n <\/head> \r\n <body> \r\n <div> \r\n <label for=\"txtName\">Name: <\/label><input type=\"text\" id=\"txtName\" \/> \r\n <button id=\"btnSayHello\" value=\"SayHello\">Say Hello<\/button> \r\n <br \/> \r\n <label id=\"lblMessage\"><\/label> \r\n <\/div> \r\n \r\n <script type=\"text\/javascript\"> \r\n var $SayHelloURL = \"@Url.Action(\"SayHello\", \"Home\")\"; \r\n $(\"#btnSayHello\").on(\"click\", function () { \r\n var _name = $(\"#txtName\").val(); \r\n $.ajax({ \r\n method: \"GET\", \r\n url: $SayHelloURL, \r\n data: { name: _name }, \r\n success: function(data){ \r\n if(data.Success) \r\n { \r\n $(\"#lblMessage\").html(data.Message); \r\n $(\"#txtName\").val(''); \r\n } else { \r\n $(\"#lblMessage\").html(data.Message); \r\n $(\"#txtName\").focus(); \r\n } \r\n } \r\n }); \r\n }); \r\n <\/script> \r\n <\/body> \r\n <\/html> \r\n<\/code><\/pre>\nThis is my controller:<\/strong><\/p>\n1: using System; \r\n2: using System.Collections.Generic; \r\n3: using System.Linq; \r\n4: using System.Web; \r\n5: using System.Web.Mvc; \r\n6: \r\n7: namespace TestProject.Controllers \r\n8: { \r\n9: public class HomeController : Controller \r\n10: { \r\n11: [HttpGet] \r\n12: public JsonResult SayHello(String name) \r\n13: { \r\n14: Dictionary<String,object> aryOfDictionary = new Dictionary<string,object>(); \r\n15: if(name.Length > 0) \r\n16: { \r\n17: aryOfDictionary.Add(\"Succes\", true); \r\n18: aryOfDictionary.Add(\"Message\", @\"<span style=\"\"color:Blue;\"\">Hello \" + name + \".<\/span>\"); \r\n19: } \r\n20: else \r\n21: { \r\n22: aryOfDictionary.Add(\"Succes\", false); \r\n23: aryOfDictionary.Add(\"Message\", @\"<span style=\"\"color:Red;\"\">Please Enter Your Name...<\/span>\"); \r\n24: } \r\n25: return Json(aryOfDictionary, JsonRequestBehavior.AllowGet); \r\n26: } \r\n27: \r\n28: public ActionResult Test() \r\n29: { \r\n30: return View(); \r\n31: } \r\n32: } \r\n33: } \r\n34: \r\n<\/code><\/pre>\n","protected":false},"excerpt":{"rendered":"