Una delle funzioni più comuni in un sito è la validazione dei valori inseriti dall'utente e la segnalazione di eventuali errori. Bootstrap semplifica anche questo compito offrendo classi CSS che gestiscono i casi in cui il campo sia valido, contenga errori o contenga dei warning.
Le classi CSS da utilizzare sono has-success, has-warning e has-error che segnalano rispettivamente quando un campo è valido, contiene warnign e contiene errori. Queste classi non vanno applicate direttamente al campo, bensì al suo contenitore. Nel prossimo esempio possiamo vedere come utilizzare le classi.
<div class="form-group has-success"> <label class="control-label" for="firstName">Nome</label> <input class="form-control" id="firstName"> </div> <div class="form-group has-warning"> <label class="control-label" for="lastName">Cognome</label> <input class="form-control" id="lastName"> </div> <div class="form-group has-error"> <label class="control-label" for="birthDate">Data nascita</label> <input class="form-control" id="birthDate"> </div>
Applicando le suddette classi a runtime durante la fase di validazione, possiamo dare un feedback all'utente in maniera molto semplice.
Commenti
Per inserire un commento, devi avere un account.
Fai il login e torna a questa pagina, oppure registrati alla nostra community.
Approfondimenti
.NET Conference Italia 2024
Eliminare record doppi in Sql Server
Testare il failover sulle region in Azure Storage
Ordine e importanza per @layer in CSS
Path addizionali per gli asset in ASP.NET Core MVC
Migliorare la scalabilità delle Azure Function con il Flex Consumption
Utilizzare Containers in .NET Aspire
Triggerare una pipeline su un altro repository di Azure DevOps
Migliorare l'organizzazione delle risorse con Azure Policy
La gestione della riconnessione al server di Blazor in .NET 9
Migliorare i tempi di risposta di GPT tramite lo streaming endpoint in ASP.NET Core
Conoscere il rendering Server o WebAssembly a runtime in Blazor