ASP.NET MVC con jQuery convalida $ .ajax

Question

Ho una situazione in cui vi mando i dati ad un controllore tramite jQuery $ .ajax, i dati è una stringa JSON serializzato. (MVC 3.0)

Si lega è bene - il mio controller riceve i risultati e sono corrette. Ora poi, sto avendo un problema con esso postback convalida. Ho il sospetto che sia perché non tutti i miei oggetti sono tenuti a controlli di modulo in modo nativo.

Il problema è che devo 'add' i dati al mio modello utilizzando JavaScript, perché il modello richiede una voce da una collezione. Utilizzo di javascript, jquery, e templating, ho questa voce selezionata, e lo aggiungo al modello prima che lo manda fuori per il controller. Tuttavia il postback, questi dati non è presente (che è previsto, dal momento che avrebbe dovuto deserializzare nella matrice javascript - che non è un mio problema).

  

Il mio problema è che si esegue un doppio postback per la convalida, o del tutto assenti. Se uso e.preventDefault(); per fermare la forma normale distacco, non ho mai ottenere la convalida. Ma se io non uso questo, allora mi sempre ottenere un doppio post, che finisce a mio avviso non reindirizzamento.

Il mio codice jQuery è il seguente ..

   $('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();
   });

Questa è la funzione di serializeObject.

$.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;
};

Ecco la mia azione di controllo.

  [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);
  }

I pubblicherà ulteriori codice, se richiesto, tuttavia credo che questo è tutto ciò che è rilevante. Sto usando il knockoutjs libreria per il template, se questo è affatto rilevante. Ti prego, dimmi che cosa avete bisogno di vedere se applicabile.

Answer 1

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

Per quanto riguarda il doppio post va, questo sta accadendo perché la richiesta è presentata dal gestore di eventi e la forma attuale presentare. Per sbarazzarsi di questo problema, si desidera qualcosa di simile:

$('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;
   });

false ritorno, dirà al impedire l'evento dalla fase di elaborazione da parte del modulo, come si sta dicendo il sistema che ha gestito già.

L'altro problema che vedo con quello che stai facendo, si richiede JSON impostando dataType: 'json' questo significa che la richiesta si aspetta un oggetto JSON, e nel caso di validazione fallita, si restituisce una visione completa . Questo probabilmente non è ciò che si vuole fare.

Anche Nota:

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

che sta chiamando sulla risposta positiva sta caricando il valore della JSON si invia con la vostra richiesta e non i dati dalla risposta.