Problème lié aux UpdatePanel

Version imprimable

:salut:

Je souhaite ajouter un évènement à une case à cocher mais cela n'a pas l'air de fonctionner. Ma case à cocher se trouve dans une <asp:Table> (page ASP.Net) qui se trouve dans un FormView, le tout se trouvant dans un UpdatePanel (Ajax) qui se trouve dans un onglet (un div) jQuery (voici pour la petite hiérarchie :aie:).

Voici mon morceau de code:

Code:

1
2
3
4
5
6
7
8
9
10
            $("#ctl00_contenu_fvExploitationAgricole_chkAdresseIdentique").on('change', function () {
                if (this.checked) {
                    $("#ctl00_contenu_fvExploitationAgricole_txtAddrExploitationAjout").prop('disabled', true);
                    $("#ctl00_contenu_fvExploitationAgricole_txtCPExploitationAjout").prop('disabled', true);
                }
                else {
                    $("#ctl00_contenu_fvExploitationAgricole_txtAddrExploitationAjout").prop('disabled', false);
                    $("#ctl00_contenu_fvExploitationAgricole_txtCPExploitationAjout").prop('disabled', false);
                }
            });

:merci: d'avance :P

04/04/2014, 10h01
Jodu42

Salut,

Je ne connais que peu l'ASP, mais si c'est bien une checkbox dont tu parles, on utilise plutôt :

Code:

$(this).prop('checked')

ou

Code:

$(this).is(':checked')

Je crois qu'il est plus recommandé d'utilisé la première méthode.
04/04/2014, 10h15
Franck.H

En fait cela fonctionne si j'enlève tout de l'UpdatePanel, il faut donc que je travaille sur le comportement de ceux-ci, si on peut déplacer ce message dans le forum ASP.Net.

Pour infos, voici une version allégée de ma structure d'objets:

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
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
<div id="tabs-exploitations">
        <ul>
            <li><a href="#tab-exploitation-agricole">Exploitation agricole</a></li>
            <li><a href="#tab-types-cultures">Types de cultures</a></li>
            <li><a href="#tab-types-elevages">Types d'élevages</a></li>
        </ul>
        <div id="tab-exploitation-agricole">
            <asp:UpdatePanel runat="server" ID="UpdatePanel1">
                <ContentTemplate>
                    <asp:FormView ID="fvExploitationAgricole" runat="server" Width="1000px" DataSourceID="odsAgriculteurs">
<InsertItemTemplate>
                            <asp:Table ID="TableAjoutAgriculteur" runat="server" CssClass="tbEXP">
                                <asp:TableRow runat="server">
                                    <asp:TableCell runat="server" CssClass="td-libelle">Nom de l'exploitation agricole <font color="red"><b>*</b></font></asp:TableCell>
                                    <asp:TableCell ID="tdNomEploitation" runat="server" CssClass="td-donnee">
                                        <asp:TextBox ID="txtNomExploitationAjout" runat="server" Width="300px"></asp:TextBox>
                                    </asp:TableCell>
                                </asp:TableRow>
                                <asp:TableRow runat="server">
                                    <asp:TableCell runat="server" CssClass="td-libelle">Code SIRET (non obligatoire)</asp:TableCell>
                                    <asp:TableCell ID="tdSIRET" runat="server" CssClass="td-donnee">
                                        <asp:TextBox ID="txtSIRETAjout" runat="server" Width="300px"></asp:TextBox>
                                    </asp:TableCell>
                                </asp:TableRow>
                                <asp:TableRow runat="server">
                                    <asp:TableCell runat="server" CssClass="td-libelle">Nom de l'exploitant <font color="red"><b>*</b></font></asp:TableCell>
                                    <asp:TableCell ID="tdNomExploitant" runat="server" CssClass="td-donnee">
                                        <asp:TextBox ID="txtNomExploitantAjout" runat="server" Width="300px"></asp:TextBox>
                                    </asp:TableCell>
                                </asp:TableRow>
                                <asp:TableRow runat="server">
                                    <asp:TableCell runat="server" CssClass="td-libelle">Status</asp:TableCell>
                                    <asp:TableCell ID="tdStatus" runat="server" CssClass="td-donnee"></asp:TableCell>
                                </asp:TableRow>
                                <asp:TableRow runat="server">
                                    <asp:TableCell runat="server" CssClass="tr-categorie">Adresse de l'exploitant</asp:TableCell>
                                    <asp:TableCell runat="server" CssClass="tr-vide"></asp:TableCell>
                                </asp:TableRow>
                                <asp:TableRow runat="server">
                                    <asp:TableCell runat="server" CssClass="td-libelle">Rue <font color="red"><b>*</b></font></asp:TableCell>
                                    <asp:TableCell ID="tdRueExploitant" runat="server" CssClass="td-donnee">
                                        <asp:TextBox ID="txtAddrExploitantAjout" runat="server" Width="300px"></asp:TextBox>
                                    </asp:TableCell>
                                </asp:TableRow>
                                <asp:TableRow runat="server">
                                    <asp:TableCell runat="server" CssClass="td-libelle">Code Postal <font color="red"><b>*</b></font></asp:TableCell>
                                    <asp:TableCell ID="tdCPExploitant" runat="server" CssClass="td-donnee">
                                        <asp:TextBox ID="txtCPExploitantAjout" runat="server" Width="100px" MaxLength="5"></asp:TextBox>
                                    </asp:TableCell>
                                </asp:TableRow>
                                <asp:TableRow runat="server">
                                    <asp:TableCell runat="server" CssClass="td-libelle">Ville</asp:TableCell>
                                    <asp:TableCell ID="tdVilleExploitant" runat="server" CssClass="td-donnee">
                                        <asp:DropDownList ID="ddlCommunesExploitant" runat="server" Width="300px" DataSourceID="odsCommunes"
                                            DataTextField="NOM" DataValueField="NOM" AutoPostBack="true">
                                        </asp:DropDownList>
                                    </asp:TableCell>
                                </asp:TableRow>
                                <asp:TableRow runat="server">
                                    <asp:TableCell runat="server" CssClass="tr-categorie">Adresse de l'exploitation agricole</asp:TableCell>
                                    <asp:TableCell runat="server" CssClass="tr-vide"></asp:TableCell>
                                </asp:TableRow>
                                <asp:TableRow runat="server">
                                    <asp:TableCell runat="server" CssClass="td-libelle">Adresse identique à celle de l'exploitant</asp:TableCell>
                                    <asp:TableCell runat="server" CssClass="td-donnee">
                                        <asp:CheckBox ID="chkAdresseIdentique" runat="server" AutoPostBack="True" />
                                    </asp:TableCell>
                                </asp:TableRow>
                                <asp:TableRow runat="server">
                                    <asp:TableCell runat="server" CssClass="td-libelle">Rue <font color="red"><b>*</b></font></asp:TableCell>
                                    <asp:TableCell ID="tdRueExploitation" runat="server" CssClass="td-donnee">
                                        <asp:TextBox ID="txtAddrExploitationAjout" runat="server" Width="300px"></asp:TextBox>
                                    </asp:TableCell>
                                </asp:TableRow>
                                <asp:TableRow runat="server">
                                    <asp:TableCell runat="server" CssClass="td-libelle">Code Postal <font color="red"><b>*</b></font></asp:TableCell>
                                    <asp:TableCell ID="tdCPExploitation" runat="server" CssClass="td-donnee">
                                        <asp:TextBox ID="txtCPExploitationAjout" runat="server" Width="100px" MaxLength="5"></asp:TextBox>
                                    </asp:TableCell>
                                </asp:TableRow>
                                <asp:TableRow runat="server">
                                    <asp:TableCell runat="server" CssClass="td-libelle">Ville</asp:TableCell>
                                    <asp:TableCell ID="tdVilleExploitation" runat="server" CssClass="td-donnee">
                                        <asp:DropDownList ID="ddlCommunesExploitation" runat="server" Width="300px" DataSourceID="odsCommunes"
                                            DataTextField="NOM" DataValueField="NOM" AutoPostBack="true">
                                        </asp:DropDownList>
                                    </asp:TableCell>
                                </asp:TableRow>
                        </InsertItemTemplate>
                   </asp:FormView>
                </ContentTemplate>
            </asp:UpdatePanel>
        </div>

Le but, lorsqu'on coche la case, ça active ou désactive d'autres contrôles. J'ai mis le tout dans un UpdatePanel car dans la page j'ai une GoogleMaps et si je n'utilise pas les UpdatePanel, ça me refresh tout le temps ma page et donc ça ré-initialise tout le temps ma map !

04/04/2014, 15h59
yinyang

Bonjour,

Dans ton cas, il me semble qu'il faut autorisé dans l'UpdatePanel les actions des Children (ChildrenAsTriggers) ou alors ajouter un trigger sur l'évènement du check de ta case à cocher

Dans ton cas, je préfère utiliser du JS sur le check de la case à cocher, remplir un HiddenField (avec un ID de la ligne ou autre) puis faire un "doPostback".

Seb
10/04/2014, 15h57
Franck.H

:salut:

Désolé pour la réponse tardive.. :aie:

Citation:

Envoyé par yinyang

Dans ton cas, il me semble qu'il faut autorisé dans l'UpdatePanel les actions des Children (ChildrenAsTriggers)

Déjà essayé mais ça ne change rien.

Citation:

Envoyé par yinyang

ou alors ajouter un trigger sur l'évènement du check de ta case à cocher

Tu aurais un exemple ? Je n'ai jamais utilisé ce procédé :aie:
10/04/2014, 17h13
yinyang
Une explication complète : http://dotnet.developpez.com/ajax/aj...epanel-trigger

Et pour toi, juste avant "ContentTempl
Code:

1 2 3 <Triggers> <asp:AsyncPostBackTrigger ControlID="chkAdresseIdentique" EventName="CheckedChanged" /> </Triggers>
Et normalement, tu devrais atterrir dans ta méthode "chkAdresseIdentique_CheckedChanged".

Seb
11/04/2014, 16h02
Franck.H

Ok merci seulement, il ne trouve pas mon CheckBox, sûrement du fait qu'il se trouve dans un FormView mais uniquement pour le monde Insert :aie:
12/04/2014, 13h01
Immobilis

Salut

Citation:

Envoyé par Franck.H

lorsqu'on coche la case, ça active ou désactive d'autres contrôles

Normalement tout cela doit se faire côté serveur. Tu ne dois pas ajouter de javascript. L'action de cocher la case provoque un aller retour client serveur. Tu devrais ajouter une méthode code behind sur la case à cocher pour passer dedans lors du post back (http://msdn.microsoft.com/fr-fr/libr...v=vs.110).aspx). Ensuite il faut partir à la pêche à tes contrôles pour retrouver ceux que tu dois activer ou désactiver.

A+