La unobtrusive validation ha il pregio di mantenere separato il markup HTML dal codice javascript necessario a implementare le logiche di validazione lato client. Ciò è possibile grazie a una serie di attributi personalizzati, identificati dal prefisso data-val-*, che vengono automaticamente aggiunti agli elementi che devono essere validati:
<div class="editor-field"> <input type="text" value="" id="FirstName" data-val="true" data-val-required="The FirstName field is required." /> <span data-valmsg-for="FirstName" data-valmsg-replace="true"></span> </div>
L'engine responsabile della unobtrusive validation, al caricamento della pagina, effettua automaticamente il parsing di questi attributi, preoccupandosi poi di aggiungere gli handler e le logiche di controllo necessarie.
Quando carichiamo una view tramite AJAX, per esempio sfruttando l'helper Ajax.ActionLink, l'operazione di parsing di questi attributi è stata già eseguita e, pertanto, il risultato è che la validazione lato client non sarà attiva. Per evitare questo problema, è sufficiente eseguire un'opportuna funzione Javascript al termine del caricamento:
<script type="text/ecmascript"> function initializeValidation() { $.validator.unobtrusive.parse('#contentDiv'); } </script> <div> @Ajax.ActionLink("New person", "Create", new AjaxOptions() { UpdateTargetId = "contentDiv", OnSuccess="initializeValidation" }) </div> <div id="contentDiv"></div>
Nella codice in alto, abbiamo definito una funzione initializeValidation che forza la rilettura degli attributi della unobtrusive validation sul contenuto di contentDiv. Essa verrà automaticamente eseguita al termine del caricamento della nuova view, dato che l'abbiamo referenziata nelle AjaxOptions utilizzate per impostare l'helper.
Commenti
Per inserire un commento, devi avere un account.
Fai il login e torna a questa pagina, oppure registrati alla nostra community.
Approfondimenti
Applicare il versioning ai nostri endpoint ASP.NET Core Minimal API
Sfruttare lo streaming di una chiamata Http da Blazor
Ottenere il contenuto di una cartella FTP con la libreria FluentFTP
Creare gruppi di client per Event Grid MQTT
Load test di ASP.NET Core con k6
Creare un'applicazione React e configurare Tailwind CSS
Reactive form tipizzati con FormBuilder in Angular
Utilizzare database e servizi con gli add-on di Container App
Gestire i null nelle reactive form tipizzate di Angular
Le novità di Angular: i miglioramenti alla CLI
Filtrare e rimuovere gli elementi dalla cache del browser tramite le API JavaScript
Gestire errori funzionali tramite exception in ASP.NET Core Web API
I più letti di oggi
- 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
- Annunciato Silverlight 4 RC e Windows Phone Developer Tools
- Speciale Razor: il nuovo view engine di WebMatrix e ASP.NET MVC
- Speciale Windows Store app: costruire app con WinRT per Windows 8
- Gestire lo stato all'interno di un class component di ReactJS
- Inserimenti bulk su database con la classe SqlBulkCopy di ADO.NET 2.0
- disponibile su MSDN la versione RTM di #VS2013 Update 2! https://aspit.co/auj #msTechEd