Alessandro Del Sole's Blog

{ A programming space about Microsoft® .NET® }
posts - 1908, comments - 2047, trackbacks - 352

My Links

News

Your host

This is me! Questo spazio è dedicato a Microsoft® .NET®, di cui sono molto appassionato :-)

Cookie e Privacy

Disabilita cookie ShinyStat

Microsoft MVP

My MVP Profile

Microsoft Certified Professional

Microsoft Specialist

Xamarin Certified Mobile Developer

Il mio libro su VB 2015!

Pre-ordina il mio libro su VB 2015 Pre-ordina il mio libro "Visual Basic 2015 Unleashed". Clicca sulla copertina per informazioni!

Il mio libro su WPF 4.5.1!

Clicca sulla copertina per informazioni! E' uscito il mio libro "Programmare con WPF 4.5.1". Clicca sulla copertina per informazioni!

These postings are provided 'AS IS' for entertainment purposes only with absolutely no warranty expressed or implied and confer no rights.
If you're not an Italian user, please visit my English blog

Le vostre visite

I'm a VB!

Guarda la mia intervista a Seattle

Follow me on Twitter!

Altri spazi

GitHub
I miei progetti open-source su GitHub

Article Categories

Archives

Post Categories

Image Galleries

Privacy Policy

ASP.NET Dynamic Data e Visual Basic: utilizzare un custom field template con Ajax Control Toolkit

Se avete letto la serie di miei articoli introduttivi agli ASP.NET Dynamic Data con Microsoft Visual Basic 2008 SP 1, in area Articoli di VB T&T, avete visto come siano possibili anche elevati livelli di personalizzazione dei siti Web creati attraverso tale framework.

 

Le personalizzazioni riguardano anche i cosiddetti field templates, quindi è possibile customizzare i “campi” per la visualizzazione e l’inserimento dei dati utilizzando altri controlli diversi dalle TextBox/Label o modificare l’aspetto estetico di quelli implementati di default. Nella precedente occasione ci limitammo, per fini dimostrativi, a variare il colore di sfondo di una TextBox, associata a una proprietà di un’entità, durante la fase di modifica dei dati.

 

In questo post vedremo come utilizzare uno dei controlli messi a disposizione dall’Ajax Control Toolkit, in particolare il controllo SliderExtender. Si tratta di un esempio abbastanza tipico quando si parla dei Dynamic Data, solo che noi lo tratteremo dal punto di vista Visual Basic 2008, cosa che sovente non avviene J, precisando alcune cose che nei vari tutorial non ho trovato.

 

Partiamo quindi dal presupposto di aver già creato un sito Web basato sui Dynamic Data, in cui si acceda al database di esempio Northwind attraverso LINQ-to-SQL. Il modello a oggetti sarà costituito dalla mappatura di tutte le tabelle del database stesso. I passaggi per eseguire tutta questa serie di operazioni sono riassunti nel primo articolo della serie citata.

 

Come detto, vogliamo utilizzare l’Ajax Control Toolkit, che offre alcuni interessanti controlli e che potete facilmente reperire a questo indirizzo su CodePlex. Tra i controlli offerti, utilizzeremo quello chiamato SliderExtender e che consiste in uno slider, quindi una barra per la scelta di valori mediante un selettore.

 

Il primo passaggio da eseguire, quindi, è quello di aggiungere un riferimento all’assembly AjaxControlToolkit.dll nel nostro sito Web. Nel nostro esempio vogliamo far sì che sia possibile modificare il valore della proprietà Quantity dell’entità Order_Details mediante selettore, quindi col mouse, invece che scrivere manualmente il numero dei pezzi di un ordine mediante TextBox. Per fare questo, possiamo creare un field template personalizzato, riferibile al tipo di dato di nostro interesse. Microsoft Visual Studio 2008 SP 1 offre un nuovo modello di elemento chiamato Dynamic Data Field e che possiamo aggiungere al sito utilizzando il comando Website|Add new item. Il template si trova nella finestra Add New Item e va rinominato in IntegerSlider.ascx, come evidenziato in figura:

 

 

 

Una volta eseguita questa operazione, in Solution Explorer noterete due nuovi file inclusi nella cartella FieldTemplates, IntegerSlider.ascx e IntegerSlider_Edit.ascx. Come ormai sapete, il primo template viene utilizzato nel sito per la visualizzazione dei dati mentre il secondo per la sua modifica. Tenuto conto che a noi interessa la sola fase di modifica, possiamo eliminare il file IntegerSlider.ascx e mantenere solo il secondo. Ora, attiviamo l’editor di codice XHTML sul file IntegerSlider_Edit.ascx. In primo luogo, è necessario scrivere una direttiva Register al fine di poter utilizzare il namespace AjaxControlToolkit:

 

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajaxToolkit" %>

 

Fatto questo, aggiungiamo il seguente codice che implementa una Label e uno SliderExtender. Quest’ultimo è in binding con la Label associata, a sua volta, alla TextBox originaria:

 

<asp:Label ID="Label1" runat="server" />

 

<ajaxToolkit:SliderExtender ID="SliderExtender1" runat="server" TargetControlID="TextBox1"

                            Minimum="0"

                            Maximum="60"

                            BoundControlID="Label1" />

 

In questo modo stiamo limitando i valori consentiti tra 0 e 60 unità. Se ricordate quanto descritto negli articoli introduttivi, vi verrà sicuramente in mente il fatto che avevamo creato una classe parziale per l’entità da influenzare con le modifiche apportate dal field template personalizzato. Anche in questa occasione dobbiamo fare la stessa cosa, senza alcuna variazione concettuale, poichè è nel template che insistono le modifiche sostanziali. Ciò premesso, nella cartella App_Code aggiungiamo una nuova classe chiamata Order_Detail.vb. Nel file di codice va innanzitutto importato il namespace System.ComponentModel.DataAnnotiations, quindi dichiarata la classe parziale. La stessa è decorata con l’attributo MetadataType che punta a un oggetto di supporto:

 

Imports System.ComponentModel.DataAnnotations

 

<MetadataType(GetType(OrderDetailMetadata))> _

Partial Public Class Order_Detail

 

End Class

 

Il citato oggetto di supporto è una classe che chiameremo OrderDetailMetadata. Nel nostro esempio è sufficiente esporre la sola proprietà Quantity, decorata con l’attributo UIHint che, come sappiamo, ci consente di specificare un template personalizzato per la visualizzazione/modifica dei dati, proprio come quello creato da noi. Ecco il codice, semplice:

 

Public Class OrderDetailMetadata

 

    Private _quantity As Object

 

    <UIHint("IntegerSlider")> _

    Public Property Quantity() As Object

        Get

            Return _quantity

        End Get

        Set(ByVal value As Object)

            _quantity = value

        End Set

    End Property

End Class

 

Fatto! Ora non ci resta che avviare il sito Web e fare clic sulla voce Order_Details in home page. Questo è il risultato che otterremo:

 

 

 

Si tratta sicuramente di un esempio abbastanza semplice, che ha però mostrato ulteriori possibilità di personalizzazione e sviluppo dei Dynamic Data, con VB 2008.

 

Alessandro

Print | posted on giovedì 11 dicembre 2008 00:24 | Filed Under [ .NET Framework Visual Basic Visual Studio 2008 LINQ ]

Powered by:
Powered By Subtext Powered By ASP.NET