jQuery Girl
  1. jQuery Girl
  3. Objet jQuery AJAX post vers contrôleur MVC – la demande s’affiche jusqu’à null
Intereting Posts
Animer l’affichage CSS Mettre en forme les champs dans Twitter bootstrap pour qu’ils se présentent comme un tableau Que se passe-t-il si j’appelle jQuery.post () avec une URL vide? jQuery – événement de sélection de l’onglet de recouvrement Comment créer un panneau Bootstrap basé sur une sortie JSON Implémentation du widget de profil Twitter Jstree – cases à cocher JQuery confirmation ne fonctionne pas JQuery script inter-domaines iframe Dois-je que mes pages Web référencent une copie de jquery.js sur mon propre serveur ou à partir de code.jquery.com? Vérifiez si le script Bootstrap Datepicker est chargé navigateur basé sur webkit interprète le json comme un script Obtenir la valeur de la balise d’option sélectionnée dans une zone de sélection Problème dans la galerie de vignettes d’image boutons suivant et précédent Webpack 2 chargement, exposition et regroupement de jQuery et bootstrap

Objet jQuery AJAX post vers contrôleur MVC – la demande s’affiche jusqu’à null

Je sais que je manque quelque chose dans les détails ici.

Problème

Malgré googler, essayer des exemples, des formats différents, etc., la demande AJAX que j’envoie est toujours validée comme contenant tous les champs vides, mais non nuls.

Je pense que je n’envoie pas les éléments dans le format approprié pour que le contrôleur puisse les reconnaître comme un object, mais je ne sais pas quoi.

Fiddler: A quoi ressemble ma demande

Avec quelques données factices:

entrez la description de l'image ici

Code: classe de modèle 

public class ContactUsMessage { public ssortingng Email { get; set; } public ssortingng Name { get; set; } public ssortingng PhoneNumber { get; set; } public ssortingng Message { get; set; } }

Code: contrôleur WebAPI 

  [HttpPost] public HttpResponseMessage NewMessage(ContactUsMessage messageToSend) { if (messageToSend == null) { var sadResponse = Request.CreateResponse(HttpStatusCode.BadRequest, "Empty Request"); return sadResponse; } var messageValidator = new ContactUsMessageValidator(); var results = messageValidator.Validate(messageToSend); var failures = results.Errors; var sadSsortingng = ""; if (!results.IsValid) { foreach (var error in failures) { sadSsortingng += " Problem: " + error.ErrorMessage; } var sadResponse = Request.CreateResponse(HttpStatusCode.NotAcceptable, "Model is invalid." + sadSsortingng); return sadResponse; } else { SendContactFormEmail(messageToSend.Email, messageToSend.Name, messageToSend.PhoneNumber, messageToSend.Message); }

Code: JavaScript sur la page 

 function sendSubmissionForm() { var dataObject = JSON.ssortingngify( { messageToSend: { 'Email': $('#inpEmail').val(), 'Name': $('#inpName').val(), 'PhoneNumber': $('#inpPhone').val(), 'Message': $('#inpMessage').val() } }); $.ajax({ url: '/api/contactus/newmessage', type: 'POST', done: submissionSucceeded, fail: submissionFailed, data: dataObject }); }

Lorsque vous avez JSON.ssortingngifyied votre object de données, vous l’avez converti en JSON. Mais vous avez oublié de définir l’en-tête de requête Content-Type et l’API Web n’a aucun moyen de savoir si vous envoyez du JSON, du XML ou autre chose: 

 $.ajax({ url: '/api/contactus/newmessage', type: 'POST', contentType: 'application/json', done: submissionSucceeded, fail: submissionFailed, data: dataObject });

De même, lors de la création du JSON, vous n’avez pas besoin de l’envelopper dans une propriété supplémentaire correspondant au nom de l’argument de votre méthode. Ce qui suit devrait également fonctionner: 

 var dataObject = JSON.ssortingngify({ 'Email': $('#inpEmail').val(), 'Name': $('#inpName').val(), 'PhoneNumber': $('#inpPhone').val(), 'Message': $('#inpMessage').val() });