JQuery pour appeler la méthode d'action dans ASP.NET MVC C # par Ajax

J'ai essayé pendant des heures de fonctionner, et j'espère vraiment que l'un d'entre vous connait beaucoup plus que moi. Lorsque le client s'inscrit dans une zone de texte, j'aimerais appeler le contrôleur MVC C # Méthode appelée updateOrder (). Idéalement, j'aimerais accéder aux éléments de formulaire avec FormCollection (le formulaire s'appelle "createOrder").

Dans le contrôleur, j'ai:

C #

[WebMethod] public static void updateOrder(){ string s = "asdf"; } 

La déclaration de chaîne ci-dessus est repérée. Dans la vue, j'ai une méthode que j'ai essentiellement copiée et collée que j'ai trouvé sur stackoverflow:

JavaScript

 function updateOrderJS() { var $form = $('form[id="createOrder"]'); $.ajax({type : "POST", url : $form.attr('action'), data : $form.serialize(), error : function(xhr, status, error) {}, success : function(response) { updateOrder(); } }); return false; } 

L'événement est simplement:

JavaScript

 updateOrderJS(); 

La méthode updateOrderJS () se déclenche (vérifiée avec une alerte), mais le point d'arrêt ne fonctionne pas.

Dans Asp.Net MVC, vous n'avez pas besoin de décorer votre méthode avec WebMethod . Vous créez simplement une Action (qui est une méthode) et en retournez un résultat. Pour l'échantillon:

 public class CustomerController : Controller { public ActionResult Index() { return View(); } [HttpPost] public ActionResult UpdateOrder() { // some code return Json(new { success = true, message = "Order updated successfully" }, JsonRequestBehavior.AllowGet); } } 

Et dans votre View , vous pouvez essayer un javascript comme ceci (en utilisant la méthode $ .ajax jquery – voir les commentaires):

 $.ajax({ url: '@Url.Action("UpdateOrder")', // to get the right path to controller from TableRoutes of Asp.Net MVC dataType: "json", //to work with json format type: "POST", //to do a post request contentType: 'application/json; charset=utf-8', //define a contentType of your request cache: false, //avoid caching results data: {}, // here you can pass arguments to your request if you need success: function (data) { // data is your result from controller if (data.success) { alert(data.message); } }, error: function (xhr) { alert('error'); } }); 

Dans MVC, vous n'avez pas besoin des éléments [WebMethod] – vous pouvez simplement avoir une action régulière du contrôleur en retournant un ActionMethod (ou nul si vous n'avez pas besoin d'une valeur de retour). L'attribut WebMethod avec des méthodes statiques est pour WebForms, et non MVC.

 public ActionMethod updateOrder(MyModel someModel) { // Do something return null; } 

Votre URL dans javascript serait l'URL de cette action, que vous pouvez accéder à Razor en utilisant @Url.Action("updateOrder", "Orders") , où "Orders" est le nom de votre contrôleur.

  1. Assurez-vous que "url" se trouve au format page.aspx / updateOrder .

  2. Spécifier le datatype: json

  3. Assurez-vous que votre updateOrderJS() est appelé.

  4. Assurez-vous contentType: "application/json; charset=utf-8" est inclus.

Remarque: [WebMethod] est utilisé pour appeler des méthodes de formulaires Web, et non MVC.

Il semble que vous mettez l'URL de la route MVC dans l'attribut d' action de votre <form> . Je ne peux pas voir à quoi ressemble cet attribut parce que vous n'avez pas affiché votre html, mais de ce que je peux voir, la valeur de cet attribut pourrait être erronée.

La plupart du temps, l'URL d'une action MVC spécifique est http://ServerDomain/Path(IfAny)/ControllerName/ActionName . Par exemple, si vous avez un contrôleur et une action comme celle-ci …

 public class StackController { [HttpPost] public ActionResult Overflow() { return View(); } } 

… et votre application ASP.NET est déployée sur http://www.example.com, l'URL dans l'attribut d' action de votre <form> serait http://www.example.com/Stack/Overflow .

Bien sûr, il est possible pour d'autres paramètres dans votre ASP.NET MVC de modifier ces URL, telles que la configuration de l'itinéraire dans la méthode RegisterRoutes votre global.asax, ou peut-être si vos contrôleurs sont divisés en zones. Si l'URL de votre <form> semble correcte, publiez le html avec tout code de routage du contrôleur approprié dans votre application ASP.NET.

Si votre formulaire se trouve dans une vue Razor (fichier cshtml), vous pouvez utiliser <form action="@Url.Action({ controller = "ControllerName", action = "ActionName" })" method="post"> pour générer L'URL de formulaire correcte.