ASP.NET MVC Validation avec jQuery $ .ajax

Question

J'ai une situation où je vous envoie des données à un contrôleur via .ajax jQuery $, les données sont une chaîne JSON sérialisé. (MVC 3,0)

Il lie bien - mon contrôleur reçoit les résultats et ils sont corrects. Maintenant, je suis un problème avec ce retour validation affichant. Je pense qu'il est parce que tous mes objets sont liés pour former nativement des contrôles.

Le problème est que je dois données « ajouter » à mon modèle en utilisant javascript, parce que le modèle nécessite un élément d'une collection. J'ai choisi cet objet, et je l'ajoute au modèle avant qu'il ne l'envoie hors du contrôleur en utilisant javascript, jquery, et Templating,. Cependant sur la publication, ces données ne sont pas présentes (ce qui est attendu, car il aurait désérialiser dans le tableau javascript - qui n'est pas mon problème).

  

Mon problème est qu'il effectue un double-postback pour la validation, ou pas du tout. Si j'utilise e.preventDefault(); pour arrêter l'affichage de forme normale, je ne me validation. Mais si je ne l'utilise, alors je toujours obtenir un poste double, qui finit à mon avis jamais redirection.

Code jQuery Mon est le suivant ..

   $('form').submit(function(e){

    var data = $('form').serializeObject();
    data.Quality = // this line adds some data from a JSON object.

    var json = JSON.stringify(data);

    $.ajax({
      url: location.href,
      type: 'POST',
      dataType: 'json',
      data: json,
      contentType: 'application/json',
      success: function (data) {
       $("#jsonOutput").html(json);
      }
    });

    e.preventDefault();
   });

Voici la fonction serialiseObjet.

$.fn.serializeObject = function () {
 var o = {};
 var a = this.serializeArray();
 $.each(a, function () {
  if (o[this.name]) {
   if (!o[this.name].push) {
    o[this.name] = [o[this.name]];
   }
   o[this.name].push(this.value || '');
  } else {
   o[this.name] = this.value || '';
  }
 });
 return o;
};

Voici mon action du contrôleur.

  [HttpPost]
  public ActionResult Blueprint(Blueprint blueprint)
  {
   if (ModelState.IsValid)
   {
    using (var context = new Mapping.DataContext())
    {
     context.Blueprints.Add(blueprint);
     context.SaveChanges();

     return Json(Redirect("/List/Blueprints")); 
    }
   }

   return View(blueprint);
  }

Je vais poster plus de code à la demande, mais je pense que cela est tout ce qui est pertinent. J'utilise la bibliothèque knockoutjs pour le templating, si cela est du tout pertinent. S'il vous plaît me dire ce que vous devez voir le cas échéant.

Answer 1

 $("#jsonOutput").html(json);

En ce qui concerne le double post va, ce qui se passe parce que la demande est soumise par votre gestionnaire d'événements et la forme réelle soumettre. Pour se débarrasser de ce problème, vous voulez quelque chose comme ceci:

$('form').submit(function(e){

    var data = $('form').serializeObject();
    data.Quality = // this line adds some data from a JSON object.

    var json = JSON.stringify(data);

    $.ajax({
      url: location.href,
      type: 'POST',
      dataType: 'json',
      data: json,
      contentType: 'application/json',
      success: function (data) {
       $("#jsonOutput").html(json);
      }
    });

    return false;
   });

faux retour, racontera l'empêcher l'événement d'être traité par la forme que vous dites au système que vous avez géré déjà.

L'autre problème que je vois avec ce que vous faites, vous demandez JSON en définissant dataType: « json » Cela signifie que votre demande attend un objet JSON, et dans le cas de validation a échoué, vous retournez une vue complète . Ceci est probablement pas ce que vous voulez faire.

En outre Remarque:

$("#jsonOutput").html(json);

Ce qui est appelé à réponse positive chargement de la valeur du JSON que vous envoyez à votre demande et non pas les données de la réponse.