JsAction è una piccola e leggera libreria per ASP.NET MVC, in grado di generare automaticamente codice javascript basato su jQuery che permette di chiamare lato client qualsiasi metodo lato server, attraverso una sola DataAnnotation e una singola linea di codice.
Supponiamo di avere un controller chiamato Home, semplicissimo e minimale, con un metodo che ritorna una stringa:
public string MyTestMethod() { return "Test String"; }
Ci proponiamo di voler chiamare il metodo dal client usando javascript e AJAX e di visualizzare a video il risultato. Il codice dovrebbe essere più o meno una cosa del genere:
function AjaxDisplayString() { $.ajax({ url: @Url.Action("MyTestMethod"), method: 'GET', success: function(data) { alert(data); } }); }
Questo semplice approccio, se pur funzionante, ha alcuni difetti:
- Nei file .js, per default, non è disponibile l'helper @Url e quini è necessario scrivere l'url a mano, utilizzare delle estensioni o salvare l'url precedentemente in qualche variabile.
- Cosa succede se il metodo viene marcato con HttpPost? Occorre modificare la chiamata Ajax per poter "riallineare" il metodo client e metodo server. E se poi si cambia idea e lo si rende disponibile solo a richieste di tipo GET? E' necessario ancora una volta modificare il codice.
JsAction si occupa tutto di questo (e di molto altro) automaticamente utilizzando una singola DataAnnotation.
L'installazione di JsAction è estremamente rapida: il pacchetto può essere scaricato dal sito e inserito come riferimento nel proprio progetto o (metodo consigliato) essere aggiunto usando NuGet.
E' sufficiente andare su:
Tools -> Library Package Manager -> Add Library Package Reference e selezionare OnLine. Una volta trovato il pacchetto premere Install.
Terminato il download deve essere aggiunta una entry nella route table per permettere a JsAction di gestire le sue chiamate.
La procedura è semplice: andiamo su global.asax e cerchiamo la funzione RegisterRoutes:
public static void RegisterRoutes(RouteCollection routes) { routes.IgnoreRoute("{resource}.axd/{*pathInfo}"); routes.Add(JsAction.JsActionRouteHandlerInstance.JsActionRoute); //JsAction routes.MapRoute( "Default", // Route name "{controller}/{action}/{id}", // URL with parameters new { controller = "Home", action = "Index", id = UrlParameter.Optional } // Parameter defaults ); }
E' molto importante inserire la route di JsAction prima del MapRoute di default.
L'ultimo passo è referenziare JsAction nella layout page (solitamente layout.cshtml):
@using JsAction <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>@ViewBag.Title</title> <link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" /> <script src="../../Scripts/jquery-1.7.1.min.js" type="text/javascript"></script> <script src="../../Scripts/jquery.unobtrusive-ajax.min.js" type="text/javascript"></script> @Html.JsAction() <script src="../../Scripts/script.js" type="text/javascript"></script> </head> <body> @RenderBody() </body> </html>
Riprendiamo il nostro metodo e marchiamolo con l'attributo JsAction:
[JsAction()] public string MyTestMethod(int a, int b) { return (a+b).ToString(); }
La presenza dell'attributo farà automaticamente sì che venga generato un oggetto JsActions con all'interno il nostro metodo:
$(document).ready(function () { var ret = JsActions.Home.MyTestMethod(1,2); });
La chiamata AJAX, pertato, può essere eseguita ora tramite una sola riga di codice.
Ma JsAction fa anche altro: è in grado di leggere diversi attributi standard (NonAction, ActionName) e di modificare il codice javascript a seconda delle scelte fatte dall'utente, costruendo l'oggetto proxy in accordo alle scelte dei metodi supportati (GET o POST).
JsAction è in continua crescita, nella release più recente è stato aggiunto anche il supporto all'intellisense, come possiamo vedere dalla figura, ed ha anche diverse altre funzionalità.
Maggiori informazioni sul progetto possono essere reperite sul sito ufficiale all'indirizzo http://jsaction.codeplex.com.
Commenti
Per inserire un commento, devi avere un account.
Fai il login e torna a questa pagina, oppure registrati alla nostra community.
Approfondimenti
Elencare le container images installate in un cluster di Kubernetes
Autenticarsi in modo sicuro su Azure tramite GitHub Actions
Evitare la script injection nelle GitHub Actions
Paginare i risultati con QuickGrid in Blazor
Utilizzare Tailwind CSS all'interno di React: installazione
Copiare automaticamente le secret tra più repository di GitHub
Modificare i metadati nell'head dell'HTML di una Blazor Web App
Utilizzare la libreria Benchmark.NET per misurare le performance
Controllare gli accessi IP alle app con Azure Container Apps
Utilizzare la versione generica di EntityTypeConfiguration in Entity Framework Core
Utilizzare il trigger SQL con le Azure Function
Specificare il versioning nel path degli URL in ASP.NET Web API
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