Insertion avec le DetailsView

Le contrôle DetailsView est taillé sur mesure pour permettre d'ajouter des données. Tout comme le GridView, il contient des automatismes pour faciliter la tâche.

Lorsque la page Web doit permettre l'insertion de données, une technique intéressante est de présenter les données existantes dans un GridView et permettre l'insertion de données à l'aide d'un bouton situé sous le GridView. Ce bouton affichera une page contenant un DetailsView dont la propriété DefaultMode et à Insert.

▼Publicité

Dans le plus simple des cas, c'est la requête SELECT du DataSource associé au DetailsView qui déterminera quels champs doivent être affichés. Il est également possible de spécifier nous-mêmes les champs à afficher en mettant la propriété AutoGenerateRows à false.

Ceci sera pratique, entre autres, lorsque l'enregistrement contient une clé étrangère. On pourra utiliser un DropDownList pour permettre à l'usager de sélectionner une valeur à partir des données de la table liées.

Ex : <asp:DetailsView ID="dvProduit" runat="server" DataSourceID="dsProduit" DefaultMode="Insert" AutoGenerateRows="false" AutoGenerateInsertButton="true" OnItemInserted="dvProduit_ItemInserted">

            <Fields>

                <asp:BoundField DataField="prod_nom" HeaderText="Nom :" />

                <asp:BoundField DataField="prod_prix" HeaderText="Prix :" DataFormatString="{0:c0}" />

                <asp:TemplateField HeaderText="Catégorie :" >

                    <EditItemTemplate>

                        <asp:DropDownList ID="ddlCategorie" runat="server" DataSourceID="dsCategorie"

                                      DataTextField="cat_desc" DataValueField="cat_id"

                                      SelectedValue='<%# Bind("prod_cat_id") %>' >

                        </asp:DropDownList>

                    </EditItemTemplate>

                    <ItemTemplate>

                        <asp:Label ID="categorie" runat="server" Text='<%# Bind("cat_desc") %>'></asp:Label>

                    </ItemTemplate>

                </asp:TemplateField>

            </Fields>

        </asp:DetailsView>

        ...

        <asp:SqlDataSource ID="dsProduit" runat="server"

            ConnectionString="<%$ ConnectionStrings:dbcsChaletBoisRond %>"

            SelectCommand="SELECT prod_nom, prod_prix, prod_cat_id, cat_desc FROM produit

            INNER JOIN categorie ON cat_id=prod_cat_id"

            InsertCommand="INSERT INTO produit(prod_nom,prod_prix,prod_cat_id)

            VALUES(@prod_nom, @prod_prix, @prod_cat_id)">

    </asp:SqlDataSource>

    <asp:SqlDataSource ID="dsCategorie" runat="server"

            ConnectionString="<%$ ConnectionStrings:dbcsChaletBoisRond %>"

            SelectCommand="SELECT cat_id,cat_desc FROM categorie">

    </asp:SqlDataSource>

Ce code générera un affichage semblable à celui-ci :

ASP-ExempleDetailsViewAvecDropDownList

Pour plus d'information

« ASP.NET 2: DetailsView Control containing a Drop-Down List in Edit Mode ». MSDN. http://blogs.msdn.com/robburke/archive/2005/04/01/404727.aspx

« GridView extras - DetailsView ». Bean software. http://www.beansoftware.com/ASP.NET-Tutorials/GridView-DetailsView.aspx

Merci de partager ! Share on FacebookTweet about this on TwitterShare on Google+Share on LinkedInPin on PinterestShare on StumbleUponEmail this to someone
Catégories