Ajouter des éléments statiques et des résultats à l’aide de Visual C# à partir d’une liaison de données à un contrôle DropDownList

Cet article explique comment ajouter des éléments statiques et des éléments liés aux données à un contrôle DropDownList. L’exemple de cet article remplit un contrôle DropDownList avec un élément initial.

Version d’origine du produit : Visual C#
Numéro de la base de connaissances d’origine : 312489

Configuration requise

La liste suivante décrit le matériel et les logiciels recommandés dont vous avez besoin :

  • Microsoft Windows
  • .NET Framework
  • Visual Studio .NET
  • Internet Information Services (IIS)
  • SQL Server

Cet article fait référence à l’espace de noms System.Data.SqlClientde bibliothèque de classes .NET Framework suivant .

Utiliser Visual C# pour créer une application web ASP.NET

Pour créer une application web ASP.NET nommée DDLSample, procédez comme suit :

  1. Ouvrez Visual Studio .NET.
  2. Dans le menu Fichier, pointez sur Nouveau, puis sélectionnez Projet.
  3. Dans la boîte de dialogue Nouveau projet , sélectionnez Projets Visual C# sous Types de projets, puis sélectionnez ASP.NET application web sous Modèles.
  4. Dans la zone Emplacement , remplacez WebApplication1 dans l’URL par défaut par DDLSample. Si vous utilisez le serveur local, vous pouvez laisser le nom du serveur en tant http://localhost que afin que la zone Emplacement affiche http://localhost/DDLSample.

Créer l’exemple

Dans les étapes suivantes, vous créez une page .aspx qui contient un contrôle DropDownList. Le contrôle DropDownList est lié aux données liées aux colonnes de la Authors table de la base de données SQL Server Pubs.

  1. Pour ajouter un formulaire web au projet, procédez comme suit :

    1. Cliquez avec le bouton droit sur le nœud du projet dans Explorateur de solutions, sélectionnez Ajouter, puis Ajouter un formulaire web.
    2. Nommez la page .aspx DropDown.aspx, puis sélectionnez Ouvrir.
  2. Vérifiez que la page est ouverte en mode Création dans l’éditeur. Ajoutez un contrôle DropDownList à la page. Dans le volet Propriétés , remplacez l’ID du contrôle par AuthorList.

  3. Ajoutez un contrôle Label à la page après le contrôle DropDownList. Dans le volet Propriétés , remplacez l’ID du contrôle par CurrentItem.

  4. Ajoutez un contrôle Button à la page après le contrôle Label. Dans le volet Propriétés , remplacez l’ID du contrôle par GetItem, puis remplacez la propriété Text par Get Item.

  5. Cliquez avec le bouton droit sur la page, puis sélectionnez Afficher le code. Cela ouvre le fichier de classe code-behind dans l’éditeur.

  6. Ajoutez l’espace System.Data.SqlClient de noms au fichier de classe code-behind afin que l’exemple de code fonctionne correctement. La liste complète des espaces de noms doit s’afficher comme suit.

    using System;
    using System.Collections;
    using System.ComponentModel;
    using System.Data;
    using System.Drawing;
    using System.Web;
    using System.Web.SessionState;
    using System.Web.UI;
    using System.Web.UI.WebControls;
    using System.Web.UI.HtmlControls;
    using System.Data.SqlClient;
    
  7. Ajoutez le code suivant à l’événement Page_Load .

    private void Page_Load (object sender, System.EventArgs e)
    {
        if (!IsPostBack)
        {
            SqlConnection myConn = new SqlConnection (
                "Server=localhost;Database=Pubs;Integrated Security=SSPI");
            SqlCommand myCmd = new SqlCommand (
                "SELECT au_id, au_lname FROM Authors", myConn);
            myConn.Open ();
            SqlDataReader myReader = myCmd.ExecuteReader ();
    
            //Set up the data binding.
            AuthorList.DataSource = myReader;
            AuthorList.DataTextField = "au_lname";
            AuthorList.DataValueField = "au_id";
            AuthorList.DataBind ();
    
            //Close the connection.
            myConn.Close ();
            myReader.Close ();
    
            //Add the item at the first position.
            AuthorList.Items.Insert (0, "<-- Select -->");
        }
    }
    

    Pour utiliser la sécurité intégrée dans la chaîne de connexion, modifiez le fichier Web.config de l’application et définissez l’attribut impersonate de l’élément identity de configuration sur true, comme illustré dans l’exemple suivant.

    <configuration>
        <system.web>
            <identity impersonate="true" />
        </system.web>
    </configuration>
    

    Pour plus d’informations, consultez ASP.NET Emprunt d’identité.

  8. Modifiez le chaîne de connexion en fonction de votre environnement.

  9. Basculez vers le mode Création dans l’éditeur pour la page .aspx. Double-cliquez sur GetItem. Ajoutez le code suivant à l’événement GetItem_Click dans le fichier de classe code-behind.

    private void GetItem_Click (object sender, System.EventArgs e)
    {
        string itemText = AuthorList.SelectedItem.Text;
        string itemValue = AuthorList.SelectedItem.Value;
        CurrentItem.Text = string.Format (
            "Selected Text is {0}, and Value is {1}", itemText, itemValue);
    }
    
  10. Dans le menu Fichier , sélectionnez Enregistrer tout pour enregistrer le formulaire web et les autres fichiers projet associés.

  11. Dans le menu Générer de l’environnement de développement intégré (IDE) Visual Studio .NET, sélectionnez Générer pour générer le projet.

  12. Dans Explorateur de solutions, cliquez avec le bouton droit sur la page .aspx, puis sélectionnez Afficher dans le navigateur. Notez que la page s’ouvre dans le navigateur et que la zone de liste déroulante est remplie avec les données initiales.

  13. Sélectionnez un élément dans la zone de liste déroulante. Notez que le contrôle CurrentItem Label affiche l’élément que vous avez sélectionné. En outre, notez que la liste conserve la position actuelle et l’entrée statique.

Résolution des problèmes

  • Vous devez placer le code pour ajouter l’élément statique à la ListItem collection du contrôle après le code de liaison de données. Si vous n’ajoutez pas le code dans cet ordre, la liste est recréée avec le code de liaison de données, qui remplace l’entrée statique.
  • L’exemple de code vérifie la IsPostBack propriété pour empêcher la recréation de la liste. En outre, ce code vérifie IsPostBack que l’élément sélectionné est conservé à la position actuelle de la liste entre les allers-retours vers le serveur.

References