Come sappiamo, ASP.NET MVC mette a disposizione una serie di html helper tramite aggiungere funzionalità Ajax alle nostre pagine. In particolare, Ajax.BeginForm ci consente di realizzare una form il cui contenuto, alla pressione del pulsante submit, verrà inviato tramite una chiamata asincrona.

@using (Ajax.BeginForm(...))
{
  <div>
    ... Contenuto della form qui ...
  </div>
}

Per quanto ci riguarda, il tutto funziona in maniera trasparente grazie agli script di unobtrusive-ajax inclusi nel template di progetto di Visual Studio, senza che dobbiamo scrivere altro codice; eppure esistono dei casi in cui è necessario gestire manualmente l'invio del form. Immaginiamo, per esempio, di aver predisposto una form di ricerca, che consenta di visualizzare su schermo i risultati o di esportarli in formato PDF.

@model SearchFormViewModel

@using (Ajax.BeginForm(...))
{
  <div>Nome: @Html.EditorFor(x => x.Name)</div>
  <div>Età: @Html.EditorFor(x => x.Age)</div>

  <input type="submit" value="Cerca" />

  @Html.ActionLink("Esporta in PDF", "ExportToPdf", new { @class="export" })

}

Nel caso in cui l'utente effettui il submit per ricercare i risultati, il funzionamento Ajax compie egregiamente il suo dovere, e il contenuto della form potrà essere recuperato lato server direttamente all'interno della classe SearchFormViewModel.

public ActionResult Search(SearchFormViewModel model)
{
  // .. codice qui ..
  
  return this.PartialView(...);
}

Per quanto riguarda il link "Esporta in PDF", invece, il problema è leggermente più complesso: esso, infatti, rimanda alla action ExportToPdf che, verosimilmente, restituirà un contenuto di tipo File. Purtroppo, questo tipo di chiamate non possono essere effettuate tramite Ajax, perché il browser non consente il salvataggio di contenuti ricevuti tramite XmlHttpRequest. Per far sì che possa essere inviato anche il contenuto della form, è sufficiente un piccolo script jQuery:

$(function() {
  $('.export').click(function (e) {
    e.preventDefault();
    var linkUrl = $(this).attr('href');

    var queryString = $('form').serialize();

    window.location = linkUrl + '?' + queryString;
  });
});

Al click dell'utente sul link in questione, tramite il codice in alto recuperiamo per prima cosa l'url del link, mentre possiamo determinare il contenuto da aggiungere come query string semplicemente sfruttando la funzione serialize() di jQuery. A questo punto non ci resta che realizzare la nostra action, che potrà sfruttare comunque lo stesso view model visto in precedenza:

public ActionResult ExportToPdf(SearchFormViewModel model)
{
  // .. codice qui ..
  
  return this.File(...);
}

Sarà infatti il model binder di ASP.NET MVC a recuperare dalla query string tutte le informazioni e a costruire un'istanza valida di SearchFormViewModel.