Créer un WebControl personnalisé

Version imprimable

Bonjour,

J'ai un menu vertical dans lequel j'ai créé des boutons à l'aide de DIV. Cependant je trouve que j'ai beaucoup de duplication de code et j'aimerais pouvoir créer un WebControl.

Voici à quoi ressemble mes boutons:
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 <div id="bCommun" class="mainMenuButton" title="Communs"> <input type="hidden" value="communs.aspx" /> <table border="1" style="margin-left: 10px; height: 70px;"> <tr> <td> <img src="Images/Icons/041-Shopping-bag-Icon.png" alt="" /> </td> <td> <span class="Tag2910">Communs</span> </td> </tr> </table> </div>
CSS:
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 .mainMenuButton img { width: 32; height: 32; vertical-align: middle; } .mainMenuButton { background: url('../Images/menu_button.png') no-repeat; height: 70px; width: 150px !important; line-height: 70px; overflow: hidden; } .mainMenuButton:hover { cursor: hand !important; background: url('../Images/menu_button_over.png') no-repeat; } .mainMenuButton span:hover { cursor: hand !important; } .mainMenuButton img:hover { cursor: hand !important; }
J'aimerais avoir un WebControl qui ressemblerais à cela:
Code:

1 2 <GESPHARxLite_2:MenuButton runat="server" ID="button1" NavigationLanguage="VB" tooltip="Communs" pageURL="communs.aspx" text="Communs" iconImage="Images/Icons/041-Shopping-bag-Icon.png" />
Je voudrais donc que,

tooltip = "title" du div,
pageURL = le "value" du input,
text = la valeur du span,
iconImage = le "src" de l'image.

J'ai chercher sur le Web, mais je n'ai pas trouvé de tuto qui répondait à mon besoin.

Quelqu'un pourrait m'éclairer?

Merci!

PS: Je travaille en langage VB.

Bonjour,

voici pour t'aider (mais il y a plein de tuto sur le sujet), il faut ajouter à ton projet un WebUserControl (ascx)

voici un code pour modifier le title de ta balise bCommun comme dans ton exemple :

default.aspx - bien faire le register du contrôle

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<%@ Page Language="C#" AutoEventWireup="true"  CodeFile="Default.aspx.cs" Inherits="_Default" %>
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<%@ Register TagPrefix="my" TagName="myc" Src="WebUserControl.ascx" %>
 
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
<my:myc ID="ctrl" title="LE TITRE" runat="server" />
    </div>
    </form>
</body>
</html>

le WebUserControl.ascx, bien mettre l'attribut runat=server à ton div bCommun

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
 
<%@ Control Language="C#" AutoEventWireup="true" CodeFile="WebUserControl.ascx.cs"
    Inherits="WebUserControl" %>
 
<div id="bCommun" class="mainMenuButton" runat="server">
    <input type="hidden" value="communs.aspx" />
    <table border="1" style="margin-left: 10px; height: 70px;">
        <tr>
            <td>
                <img src="Images/Icons/041-Shopping-bag-Icon.png" alt="" />
            </td>
            <td>
                <span class="Tag2910">Communs</span>
            </td>
        </tr>
    </table>
</div>

et le WebUserControl.ascx.cs

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
 
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
 
public partial class WebUserControl : System.Web.UI.UserControl
{
    private String _title;
    public string title
    {
        get
        {
            return _title;
        }
        set
        {
            _title = value;
        }
    }
 
    protected void Page_Load(object sender, EventArgs e)
    {
        bCommun.Attributes.Add("title", _title);
    }
}

Cordialement

16/03/2012, 20h50
joce21

Merci beaucoup! Exactement ce que je cherchais!