In scenari caratterizzati da un intenso uso di Javascript, uno dei problemi più comuni da affrontare in ASP.NET 3.5 è la generazione degli ID dei server control nel markup: essi infatti non sono facilmente predicibili e quindi siamo obbligati a scrivere con frequenza codice simile al seguente:
var value = $('<%=FirstName.ClientID%>').val();
ASP.NET 4.0 introduce una nuova proprietà denominata ClientIDMode, che consente di controllare l'ID generato dai controlli in modo da renderne più agevole l'utilizzo lato client. Essa può assumere i seguenti valori:
- AutoID: modalità compatibile con ASP.NET 3.5;
- Predictable: è il valore di default, rimuove il prefisso "ctl00" mantenendo solo la porzione dell'ID relativa alla coppia container/figlio;
- Static: consente di specificare nel markup l'ID indicato sul controllo stesso;
- Inherit: eredita il comportamento dal controllo contenitore.
Questa proprietà è definita dalla classe base Control, quindi può esser specificata anche a livello di pagina, nella direttiva @Page:
<%@ Page ClientIDMode="Predictable" %>
Si può inoltre indicare anche a livello di web.config:
<system.web> <pages clientIDMode="Predictable" /> </system.web>
Nel caso di controlli di tipo lista, è introdotta anche la proprietà ClientIDRowSuffix, che consente di generare gli ID dei controlli basandosi su un valore assegnato in fase di data binding:
<asp:ListView id="customersView" runat="server" ClientIDRowSuffix="CustomerID"> <ItemTemplate> <div id="customer" runat="server">....</div> </ItemTemplate> </asp:ListView>
In questo caso, il codice prodotto dal controllo sarà generato usando la proprietà CustomerID come base:
<li id="customersView_customer_ALFKI">...</li> ...
Si tratta di un accorgimento grazie al quale diventa più semplice fare riferimento diretto ad un controllo quando si utilizza Javascript: esso infatti ci consente di utilizzare un'informazione reale, in luogo del suffisso basato su indice numerico (customersView_customer_0), previsto come comportamento di default.
Commenti
Per inserire un commento, devi avere un account.
Fai il login e torna a questa pagina, oppure registrati alla nostra community.
Approfondimenti
Load test di ASP.NET Core con k6
Implementare il throttling in ASP.NET Core
Short-circuiting della Pipeline in ASP.NET Core
Generare file per il download da Blazor WebAssembly
Effettuare il deploy di immagini solo da container registry approvati in Kubernetes
Personalizzare l'errore del rate limiting middleware in ASP.NET Core
Utilizzare le Cache API di JavaScript per salvare elementi nella cache del browser
Eseguire operazioni con timeout in React
Recuperare un elemento inserito nella cache del browser tramite API JavaScript
Filtrare e rimuovere gli elementi dalla cache del browser tramite le API JavaScript
I più letti di oggi
- Utilizzare WebAssembly con .NET, ovunque
- ecco tutte le novità pubblicate sui nostri siti questa settimana: https://aspit.co/wkly buon week-end!
- Ottimizzare le performance delle collection con le classi FrozenSet e FrozenDictionary
- Utilizzare il trigger SQL con le Azure Function
- Disabilitare automaticamente un workflow di GitHub (parte 2)
- Paginare i risultati con QuickGrid in Blazor
- Ottimizzazione dei block template in Angular 17