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.
Commenti
Per inserire un commento, devi avere un account.
Fai il login e torna a questa pagina, oppure registrati alla nostra community.
Approfondimenti
Code scanning e advanced security con Azure DevOps
Le novità di Angular: i miglioramenti alla CLI
Utilizzare le collection expression in C#
Usare un KeyedService di default in ASP.NET Core 8
Personalizzare l'errore del rate limiting middleware in ASP.NET Core
Configurare policy CORS in Azure Container Apps
Elencare le container images installate in un cluster di Kubernetes
Semplificare il deployment di siti statici con Azure Static Web App
Eseguire operazioni con timeout in React
Sfruttare lo stream rendering per le pagine statiche di Blazor 8
Eseguire attività basate su eventi con Azure Container Jobs
Load test di ASP.NET Core con k6
I più letti di oggi
- Utilizzare Docker Compose con Azure App Service
- Utilizzare QuickGrid di Blazor con Entity Framework
- Modernizzare le applicazioni WPF e Windows Forms con Blazor
- ASP 3 per esempi
- annunciato #netstandard 2.1. .NET Core lo supporterà a partire da #netcore3, così come le prossime versione di #xamarin, #mono e #unity.il supporto per #netfx 4.8, invece, non ci sarà. https://aspit.co/bq2
- Steel Style CheckBox per Silverlight 4.0