TabContainer et bug d'onglets

**Delack** · 06/08/2013, 15h39

Bonjour,

Je rencontre un soucis avec un TabContainer contenu dans un UserControl.
Celui-ci s'affiche correctement, cependant, les onglets sont comme "incrustés" dans la page et il est impossible de pouvoir les sélectionner (voir l'image en pièce jointe)

Voici le code que j'ai pour ce TabContainer

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
  <ajax:TabContainer ID="OngletInfos"  runat="server"  Width="676px" >
            <%-- REPRESENTANT LEGAL --%>
            <ajax:TabPanel runat="server" HeaderText="Repr&eacute;sentant l&eacute;gal" ID="TabPanel1">
                <HeaderTemplate>Représentant légal</HeaderTemplate>
                <ContentTemplate>
                    <fieldset>
                        <p>
                            <label>Nom<q>*</q>:</label>
                            <asp:TextBox ID="txtNomRepre" runat="server"></asp:TextBox>
                        </p>
                        <p>
                            <label>Prénom<q>*</q>:</label>
                            <asp:TextBox ID="txtPrenomRepre" runat="server" MaxLength="50"></asp:TextBox>
                        </p>
                        <p>
                            <label>Fonction&nbsp;:</label>
                            <asp:DropDownList ID="ListeFonctionRepre" runat="server"></asp:DropDownList>
                        </p>
                        <p>
                            <label>Téléphone<q>*</q>:</label>
                            <asp:TextBox ID="txtTelRepre" runat="server" MaxLength="12"></asp:TextBox>
                        </p>
                        <p>
                            <label>Email<q>*</q>:</label>
                            <asp:TextBox ID="txtMailRepre" runat="server" MaxLength="50"></asp:TextBox>
                            <br />
                            <em style="color:Red;">
                                Attention : activation du compte se fait par un envoi sur cet Email. Entrez 
                                une adresse valide.
                            </em>
                        </p>
                    </fieldset> 
                    <!-- encart representant legal -->
                    <asp:RegularExpressionValidator ID="RegularExpressionValidator2" runat="server" 
                        ControlToValidate="txtTelRepre" Display="None" 
                        ErrorMessage="Le format du N&deg; de t&eacute;l&eacute;phone est incorrect. Exemple&nbsp;: 0102030405" 
                        SetFocusOnError="True" 
                        ValidationExpression="(^\+[0-9]{2}|^\+[0-9]{2}\(0\)|^\(\+[0-9]{2}\)\(0\)|^00[0-9]{2}|^0)([0-9]{9}$|[0-9\-\s]{10}$)"></asp:RegularExpressionValidator>
                    <ajax:ValidatorCalloutExtender ID="RegularExpressionValidator2_ValidatorCalloutExtender" 
                        runat="server" Enabled="True" TargetControlID="RegularExpressionValidator2">
                    </ajax:ValidatorCalloutExtender>
                    <asp:RequiredFieldValidator ID="RequiredFieldValidator5" runat="server" 
                        ControlToValidate="txtMailRepre" 
                        Display="None" ErrorMessage="Un email de contact est obligatoire." 
                        SetFocusOnError="True"></asp:RequiredFieldValidator>
                    <ajax:ValidatorCalloutExtender ID="RequiredFieldValidator5_ValidatorCalloutExtender" runat="server" 
                        Enabled="True" TargetControlID="RequiredFieldValidator5">
                    </ajax:ValidatorCalloutExtender>
                    <asp:RegularExpressionValidator ID="RegularExpressionValidator3" runat="server" 
                        ControlToValidate="txtMailRepre" Display="None" 
                        ErrorMessage="L'email du contact n'est pas conforme au standard. V&eacute;rifiez l'ortographe." SetFocusOnError="True" 
                        ValidationExpression="\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*"></asp:RegularExpressionValidator>
                    <ajax:ValidatorCalloutExtender ID="RegularExpressionValidator3_ValidatorCalloutExtender" runat="server" 
                        Enabled="True" TargetControlID="RegularExpressionValidator3">
                    </ajax:ValidatorCalloutExtender>
                    <asp:RequiredFieldValidator ID="NomRepreobli" runat="server" 
                         ControlToValidate="txtNomRepre" Display="None" 
                         ErrorMessage="Le nom du repr&eacute;sentant l&eacute;gal est obligatoire." 
                         SetFocusOnError="True"></asp:RequiredFieldValidator>
                    <ajax:ValidatorCalloutExtender ID="ValidatorCalloutExtenderNomRepreobli" runat="server" 
                        Enabled="True" TargetControlID="NomRepreobli">
                    </ajax:ValidatorCalloutExtender>
                    <asp:RequiredFieldValidator ID="PrenomRepreobli" runat="server" Display="None" 
                        ErrorMessage="Le pr&eacute;nom du repr&eacute;sentant l&eacute;gal est obligatoire." 
                         SetFocusOnError="True" ControlToValidate="txtPrenomRepre"></asp:RequiredFieldValidator>
                    <ajax:ValidatorCalloutExtender ID="ValidatorCalloutExtenderPrenomRepreobli" runat="server" 
                        Enabled="True" TargetControlID="PrenomRepreobli">
                    </ajax:ValidatorCalloutExtender>
                    <asp:RequiredFieldValidator ID="telRepreobli" runat="server" 
                        ControlToValidate="txtTelRepre" Display="None" 
                        ErrorMessage="Le N&deg; de t&eacute;l&eacute;phone du repr&eacute;sentant l&eacute;gal est obligatoire." 
                        SetFocusOnError="True"></asp:RequiredFieldValidator>
                    <ajax:ValidatorCalloutExtender ID="ValidatorCalloutExtendertelRepreobli" runat="server" 
                        Enabled="True" TargetControlID="telRepreobli">
                    </ajax:ValidatorCalloutExtender>
                </ContentTemplate>
            </ajax:TabPanel>
 
            <%-- CONTACT COMMERCIAL --%>
            <ajax:TabPanel ID="TabPanel2" runat="server" HeaderText="Contact commercial">
                <HeaderTemplate>
                    Contact commercial
                </HeaderTemplate>
                <ContentTemplate>
                    <fieldset>
                        <p>
                            <label>Nom&nbsp;: </label>
                            <asp:TextBox ID="txtNomCt" runat="server" MaxLength="50"></asp:TextBox>
                        </p>
                        <p>
                            <label>Pr&eacute;nom&nbsp;:</label>
                            <asp:TextBox ID="txtPrenomCt" runat="server"></asp:TextBox>
                        </p>
                        <p>
                            <label>Fonction&nbsp;:</label>
                            <asp:DropDownList ID="ListeFonctionCt" runat="server"></asp:DropDownList>
                        </p>
                        <p>
                            <label>Téléphone&nbsp;:</label>
                            <asp:TextBox ID="txtTelCt" runat="server" MaxLength="12"></asp:TextBox>
                        </p>
                        <p>
                            <label>Email&nbsp;:</label>
                            <asp:TextBox ID="txtEmailCt" runat="server" MaxLength="50"></asp:TextBox>
                            <asp:RegularExpressionValidator ID="RegularExpressionValidator8" runat="server" 
                                ControlToValidate="txtEmailCt" 
                                Display="None" ErrorMessage="Le format de l'email du contact est incorrect." 
                                SetFocusOnError="True" 
                                ValidationExpression="\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*"></asp:RegularExpressionValidator>
                            <ajax:ValidatorCalloutExtender ID="RegularExpressionValidator8_ValidatorCalloutExtender" runat="server" 
                                Enabled="True" TargetControlID="RegularExpressionValidator8">
                            </ajax:ValidatorCalloutExtender>
                        </p>
                    </fieldset>
                    <asp:RegularExpressionValidator ID="RegularExpressionValidator7" runat="server" 
                        ControlToValidate="txtTelCt" Display="None" 
                        ErrorMessage="Le format du N&deg; de t&eacute;l&eacute;phone est incorrect.  Exemple&nbsp;: 0102030405" 
                        ValidationExpression="(^\+[0-9]{2}|^\+[0-9]{2}\(0\)|^\(\+[0-9]{2}\)\(0\)|^00[0-9]{2}|^0)([0-9]{9}$|[0-9\-\s]{10}$)"></asp:RegularExpressionValidator>
                    <ajax:ValidatorCalloutExtender ID="RegularExpressionValidator7_ValidatorCalloutExtender" runat="server" 
                        Enabled="True" TargetControlID="RegularExpressionValidator7">
                    </ajax:ValidatorCalloutExtender>
                </ContentTemplate>
            </ajax:TabPanel> 
            <%-- MODE ENCAISSEMENT --%>
            <ajax:TabPanel ID="TabPanel4" runat="server" 
                HeaderText="" Visible="False">
                <HeaderTemplate></HeaderTemplate>
                <ContentTemplate>
                    <fieldset style="height: 548px">
                    <p>
                        <label>Mode encaissement&nbsp;:</label>
                        <asp:DropDownList ID="ListeModeEncais" runat="server"></asp:DropDownList>
                        <asp:DropDownList ID="ListeTypeOperationBancEncais" runat="server"></asp:DropDownList>
                    </p>
                    <p>
                        <label>Mode de paiement&nbsp;:</label>
                        <asp:DropDownList ID="ListeModePai" runat="server" 
                            OnSelectedIndexChanged="ListeModePai_SelectedIndexChanged"></asp:DropDownList>
                        <asp:DropDownList ID="ListeTypeOperationBancPai" runat="server"></asp:DropDownList>
                    </p>
                    <table>
                        <tr>
                            <td>RIB Paiement</td>
                            <td><asp:CheckBox ID="chkRibEncais" runat="server" 
                                    OnCheckedChanged="chkRibEncais_CheckedChanged" 
                                    Text="RIB encaissement diff&eacute;rent ?" />
                            </td>
                        </tr>
                        <tr>
                            <caption>
                                %&gt;
                                <td>
                                    <uc1:KARib ID="KARibPaiement" runat="server" />
                                </td>
                                <td>
                                    <uc1:KARib ID="KARibEncaissement" runat="server" />
                                </td>
                            </caption>
                        </tr>
                    </table>
                <p>&nbsp;</p>
                <p>&nbsp;</p>
                <p>&nbsp;</p>
            </fieldset> 
            <!-- encart Relation financière -->
        </ContentTemplate>
        </ajax:TabPanel>
        </ajax:TabContainer>

J'ai essayé de changer de navigateur et d'environnement, mais en vain, cela est reproduis partout. Je dois dire que c'est assez étrange comme bug.

Merci d'avance pour votre aide !

**Delack** · 20/08/2013, 10h48

Bonjour,

Désolé de revenir un peu tard, mais j'ai finalement trouvé la solution à mon problème.

Un panel d'envoi de mail était encore présent sur la page, et cela provoquer une erreur de script, d'où l'affichage un peu "bizarre". Je l'ai tout simplement enlevé.

A bientôt.

TabContainer et bug d'onglets

ASP.NET Ajax

Discussions similaires

Partager

Partager