Ajout d'images et de boutons dynamiquement dans une page asp .net

Télécharger le projet
Commenter

Description

Ce morceau de code montre comment ajouter des Webcontrols dynamiquement dans une page aspx.

La partie HTML (Listimage.aspx) contient un tableau runat "server" vide (sans ligne, ni colonne).

La partie code behind (Listimage.aspx.cs) : Contient un ArrayList définissant les nom des images à afficher, une boucle sur cet ArrayList permet de créer les cellules incluant les nouveaux boutons (avec la gestion d'évènement) et les nouvelles images.

Source / Exemple : 


// ------------------------------------------------------------------------------------
// PARTIE BEHIND : Listimage.aspx.cs
// ------------------------------------------------------------------------------------
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;

namespace testona
{
  public class Listimage : System.Web.UI.Page
  {
    protected System.Web.UI.WebControls.Label lblClick;
    protected System.Web.UI.WebControls.Table Table1;

    // Page_Load()
    // --------------------------------------------------------------
    private void Page_Load(object sender, System.EventArgs e)
    {
      // Initialise un ArrayList contenant les noms des images a afficher
      // --------------------------------------------------------------
      System.Collections.ArrayList lstImage = new ArrayList();
      int icol = new int();
      lstImage.Add("ancetre_programme_1.jpg");
      lstImage.Add("Ancetre_programme_2.jpg");
      lstImage.Add("AncT3couv.jpg");
      lstImage.Add("Couv._Fides3_pas_d_f.jpg");
      lstImage.Add("Fides_1.jpg");

      // Boucle sur cette liste et affiche les images dans un tableau avec un bouton de choix
      // --------------------------------------------------------------
      for (int i=0;i<lstImage.Count;i++)
      {
        // Creer les nouveaux Webcontrols a ajouter :  Bouton  et Image
        // --------------------------------------------------------------
        System.Web.UI.WebControls.Button  btn = new Button();
        System.Web.UI.WebControls.Image img = new System.Web.UI.WebControls.Image();
      				
        btn.Text="Choix N°" + i;
        btn.ID = i.ToString();
        // Ajoute une gestion d evenement sur l'objet bouton (cf. plus bas : methode Bouton_Click())
        btn.Click += new System.EventHandler(this.Bouton_Click);	

        img.ID = "Img " + i.ToString();
        img.ImageUrl = "images/" + lstImage[i];
	
        // Creer les objets TaleRow et TableCel pour ajouter une cellule dans le tableau
        // --------------------------------------------------------------
        System.Web.UI.WebControls.TableRow rw = new TableRow();
        System.Web.UI.WebControls.TableCell cel = new TableCell();

        // Gestion de l'affichage sur 2 colonnes
        // --------------------------------------------------------------
        if (((Convert.ToInt16(i % 2))==0))
        {
          // Colonne 1 : Ajout d'une nouvelle ligne (Row)
          icol+=1;
          Table1.Rows.Add(rw);
          Table1.Rows[icol-1].Cells.Add(cel);
          // Ajoute les Webcontrols Bouton et Image dans la nouvelle cellule
          Table1.Rows[icol-1].Cells[0].Controls.Add(btn);
          Table1.Rows[icol-1].Cells[0].Controls.Add(img);
        }
        else
        {
          // Colonne 2 : Pas d'ajout de ligne (Row)
          Table1.Rows[icol-1].Cells.Add(cel);
          // Ajoute les Webcontrols Bouton et Image dans la nouvelle cellule
          Table1.Rows[icol-1].Cells[1].Controls.Add(btn);
          Table1.Rows[icol-1].Cells[1].Controls.Add(img);
        }
      }
    }

    // Bouton_Click() : Méthode associee a l'evenement click  des boutons
    // --------------------------------------------------------------
    private void Bouton_Click(object sender, System.EventArgs e)
    {
      // Affiche un message contenant l'Identifiant du Bouton venant d'etre cliquer
      Button ClickedBtn = (Button)sender;
      lblClick.Text ="Vous venez de choisir le N° " + ClickedBtn.ID.ToString();
    }

    // --------------------------------------------------------------
    #region Web Form Designer generated code
    override protected void OnInit(EventArgs e)
    {
      //
      // CODEGEN : Cet appel est requis par le Concepteur Web Form ASP.NET.
      //
      InitializeComponent();
      base.OnInit(e);
    }
		
    /// <summary>
    /// Méthode requise pour la prise en charge du concepteur - ne modifiez pas
    /// le contenu de cette méthode avec l'éditeur de code.
    /// </summary>
    private void InitializeComponent()
    {    
      this.Load += new System.EventHandler(this.Page_Load);
    }
    #endregion
    // --------------------------------------------------------------
  }
}

// ------------------------------------------------------------------------------------
// PARTIE HTML : Listimage.aspx
// ------------------------------------------------------------------------------------

<%@ Page language="c#" Codebehind="Listimage.aspx.cs" AutoEventWireup="false" Inherits="testona.Listimage" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<HTML>

<HEAD>
    <title>WebForm1</title>
    <meta name="GENERATOR" Content="Microsoft Visual Studio 7.0">
    <meta name="CODE_LANGUAGE" Content="C#">
    <meta name="vs_defaultClientScript" content="JavaScript">
    <meta name="vs_targetSchema" content="http://schemas.microsoft.com/intellisense/ie5">
</HEAD>

<body>
    <form id="Form1" method="post" runat="server">
    <asp:label ID="lblClick" Runat="server" Text=""></asp:label><br><br>
    <asp:Table id="Table1" runat="server" Width="250px" Height="124px"></asp:Table>
    </form>
</body>
</HTML>
Télécharger le projet

Codes Sources

A voir également

S'inscrire maintenant

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.

Du même auteur (cs_ona)