Nello script #123 abbiamo visto come sfruttare Bootstrap per mostrare un tooltip. In questo script espandiamo l'idea parlando di come mostrare un vero e proprio popup accanto a un elemento. Bootstrap rende facile questo compito treamite il controllo popover. Questo controllo ci permette di definire il contenuto del popup direttamente dal codice HTML come nel seguente esempio.
<button type="button" class="btn btn-default" data-toggle="popover" title="Popup title" data-content="Popup content"> Toggle popover </button>
L'attributo title definisce il titolo del popup. Se questo non è presente, il titolo non viene mostrato. L'attributo data-content definisce invece il contenuto del popover.
Il codice HTML definisce il contenuto del popup, ma da solo non basta in quanto dobbiamo inizializzare il popup singolarmente per tutti i controlli. Possiamo eseguire questa operazione tramite il seguente codice
$(function () { $('[data-toggle="popover"]').popover(); })
Commenti
Per inserire un commento, devi avere un account.
Fai il login e torna a questa pagina, oppure registrati alla nostra community.
Approfondimenti
Sfruttare lo streaming di una chiamata Http da Blazor
Eseguire attività con Azure Container Jobs
Utilizzare i nuovi piani dedicati di Azure Container Apps
Gestire gli errori di caricamento delle immagini
Monitorare i server on-premises con Azure Arc
Leggere la configurazione da Azure KeyVault con logica di retry in ASP.NET Core
Montare blob e file share su Azure App Service
Utilizzo di Map e Object in Javascript
Gestire tipi complessi in query string grazie a IParsable in ASP.NET Core 7.0
.NET Conference Italia 2023
Creare automaticamente una issue di GitHub
Organizzare i moduli sfruttando CommonJS
I più letti di oggi
- .NET Conference Italia 2023 - Milano e Online
- ecco tutte le novità pubblicate sui nostri siti questa settimana: https://aspit.co/wkly buon week-end!
- Microsoft Visual Studio Code: un nuovo editor gratuito per Windows, MacOSX e Linux per sviluppatori ASP.NET e Node.js
- Registrare servizi multipli tramite chiavi in ASP.NET Core 8
- Chiamare direttamente un numero di telefono con HTML5