Accueil > > > .NET2 - REMPLIR UN DROP EN FONCTION D'UN AUTRE GRACE AU CLIENTCALLBACK
.NET2 - REMPLIR UN DROP EN FONCTION D'UN AUTRE GRACE AU CLIENTCALLBACK
Information sur la source
Description
Une des questions souvent posé sur le forum, c'est de savoir comment remplir un drop en fonction d'un autre. Ceci en asp.net est relativement simple, mais necessite un postback à chaque selection.
Dans cet exemple, je remplis un drop en fonction d'un autre mais cette fois sans faire aucun postback, ni meme en prechargeant les données dans la page via javascript, j'utilise pour cela .net 2 et le ClientCallBack - Ajax.
En quelques mots, le ClientCallBack est l'adaptation proposé par Microsoft de la méthode Ajax (Asynchronous JavaScript And XML)
Dans le zip, vous trouverez la méthode utilisé en .net 1 avec des postbacks, et surtout la méthode en .net 2
j'ai pas beaucoup expliqué le fonctionnement, pour cela je vous conseille un article de Pierre Lagarde : http://www.techheadbrothers.com/DesktopDefault.asp x?tabindex=1&tabid=7&AId=68
Dans ces 2 exemples, j'ai relativement simplifié la chose, et meme construits les données de facons pas tres jolis, mais j'ai essayé de faire simple.
Source
- ' NouvelleMethode.aspx
-
-
- <%@ Page Language="VB" MasterPageFile="~/Master/MasterPage.master" AutoEventWireup="false" CodeFile="NouvelleMethode.aspx.vb" Inherits="NouvelleMethode" title="Untitled Page" %>
- <asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
- <asp:Literal ID="Literal1" runat="server"></asp:Literal><br />
- <br />
- <asp:DropDownList ID="DropDownList1" runat="server">
- </asp:DropDownList>
- <asp:DropDownList ID="DropDownList2" runat="server">
- </asp:DropDownList>
- <br />
- <br />
- <asp:Button ID="Button1"
- runat="server" Text="Valider" /><br />
- <br />
- <asp:Literal ID="Literal2" runat="server"></asp:Literal><br />
- <br />
- <hr />
- <h2>Explication</h2>
- <p>
- Cette approche est certes plus complexe, mais beaucoup plus puissante, en effet,
- lorsque le client change de selection, l'heure ne change pas, donc il n'y a pas
- eu un retour complet du formulaire.</p>
- <p>Malheureusement, il y a pas mal de problèmes, que j'expliquerais tout à l'heure</p>
- <h3>Comment ca marche ? </h3>
- <p>Au niveau HTML + javascript, c'est "assez simple". Quand on change la selection, l'evenement onChange du drop est declenché (coté client toujours). Cet evenement va chercher webform__doCallBack qui demande surtout ce qu'on doit rapporter au serveur.
- la fonction webform__doCallBack est géré par asp.net, elle fait pas mal de petites
- choses, et au final elle appelle une fonction javascript : __onCallbackTermine que
- l'on a écrit, avec en paramètre, le retour du serveur.
- </p>
- <p>
- Coté serveur, ce que l'ont doit faire : le mieux est d'allé voir <a href="http://www.techheadbrothers.com/DesktopDefault.aspx?tabindex=1&tabid=7&AId=68" title="article sur TechHeadBrother de Pierre Lagarde"> l'article de Pierre Lagarde</a></p>
- <h3>Les problèmes</h3>
- <ul>
- <li>Il y a un gros problème avec cette méthode quand on l'utilise sur des drops, c'est que si on fait un postback classique, Me.DropDownList2.SelectedItem
- sera égale à la valeur du dernier postback, ce qui s'explique par le fait que le drop a été construit
- coté javascript, donc on ne peut pas accéder à toute les valeurs du drop, juste
- la valeur selectionné, en faisant un Me.Request(Me.DropDownList2.ClientID)</li>
- <li>Le deuxieme problème qui n'en est pas vraiment un, c'est que cette méthode et relativement
- compliqué à mettre en oeuvre, il est également trés compliqué de faire cohabiter
- une méthode par postback et par un ClientCallBack</li>
- </ul>
- <h3>La suite ?</h3>
- <p>Dans cet exemple, j'ai mis un bouton pour afficher, les resultats de la deuxieme selectionné, ceci dans le but de montrer une facon de faire cohabiter les deux méthodes. Pour voir si vous avez bien compris le fonctionnement, essayez d'afficher la selection lors d'un changement sur le deuxieme drop</p>
- </asp:Content>
-
-
- 'NouvelleMethode.aspx.vb
-
- Partial Class NouvelleMethode
- Inherits System.Web.UI.Page
- Implements ICallbackEventHandler
-
- Private Element(3) As String
- Private SousElement(3)() As String
-
- Private Sub ConstructTableau()
- If Not Page.IsPostBack Then
- 'Construction du tableau de tableau
- For i As Integer = 0 To 3
- Element(i) = "Element" & i.ToString
- ReDim SousElement(i)(9)
- For j As Integer = 0 To 9
- SousElement(i)(j) = i.ToString & " - " & j.ToString
- Next
- Next
-
- 'On met le tableau de tableau dans la variable de session
- Session("souselement") = SousElement
-
- Me.DropDownList1.DataSource = Element
- Me.DropDownList1.DataBind()
- End If
- End Sub
-
-
- Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
- ConstructTableau()
-
- 'Affichage de l'heure de la derniere requete.
- Literal1.Text = "La derniere requete s'est effectué à " & Now.ToLongTimeString
- Session("test") = "test"
- ' Ecriture du ClientCallBack
- Dim cbref As String = Page.ClientScript.GetCallbackEventReference(Me, _
- "document.getElementById ('" & Me.DropDownList1.ClientID & "').value", _
- "__onCallbackTermine", "null", False)
- Me.DropDownList1.Attributes.Add("onchange", cbref + ";return false;")
- Me.ClientScript.RegisterStartupScript(GetType(NouvelleMethode), "__onCallbackTermine", "function __onCallbackTermine (result, context){document.getElementById('" & Me.DropDownList2.ClientID & "').outerHTML = result;}", True)
- End Sub
-
- Public Function RaiseCallbackEvent(ByVal eventArgument As String) As String Implements System.Web.UI.ICallbackEventHandler.RaiseCallbackEvent
- 'Recupere le tableau de tableau a partir de la variable de session
- SousElement = Session("souselement")
-
- Me.DropDownList2.DataSource = SousElement(CInt(Right(eventArgument, 1)))
- Me.DropDownList2.DataBind()
- Dim sw As New System.IO.StringWriter()
- Dim htw As New HtmlTextWriter(sw)
- Me.DropDownList2.RenderControl(htw)
- htw.Flush()
- Return sw.ToString()
- End Function
-
- Protected Sub Button1_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles Button1.Click
- Literal2.Text = " Vous avez selectionné l'element N° " & DropDownList1.SelectedIndex & " et le sous element " & DropDownList2.SelectedIndex
- Literal2.Text = Me.Request(Me.DropDownList2.UniqueID)
- End Sub
- End Class
' NouvelleMethode.aspx
<%@ Page Language="VB" MasterPageFile="~/Master/MasterPage.master" AutoEventWireup="false" CodeFile="NouvelleMethode.aspx.vb" Inherits="NouvelleMethode" title="Untitled Page" %>
<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
<asp:Literal ID="Literal1" runat="server"></asp:Literal><br />
<br />
<asp:DropDownList ID="DropDownList1" runat="server">
</asp:DropDownList>
<asp:DropDownList ID="DropDownList2" runat="server">
</asp:DropDownList>
<br />
<br />
<asp:Button ID="Button1"
runat="server" Text="Valider" /><br />
<br />
<asp:Literal ID="Literal2" runat="server"></asp:Literal><br />
<br />
<hr />
<h2>Explication</h2>
<p>
Cette approche est certes plus complexe, mais beaucoup plus puissante, en effet,
lorsque le client change de selection, l'heure ne change pas, donc il n'y a pas
eu un retour complet du formulaire.</p>
<p>Malheureusement, il y a pas mal de problèmes, que j'expliquerais tout à l'heure</p>
<h3>Comment ca marche ? </h3>
<p>Au niveau HTML + javascript, c'est "assez simple". Quand on change la selection, l'evenement onChange du drop est declenché (coté client toujours). Cet evenement va chercher webform__doCallBack qui demande surtout ce qu'on doit rapporter au serveur.
la fonction webform__doCallBack est géré par asp.net, elle fait pas mal de petites
choses, et au final elle appelle une fonction javascript : __onCallbackTermine que
l'on a écrit, avec en paramètre, le retour du serveur.
</p>
<p>
Coté serveur, ce que l'ont doit faire : le mieux est d'allé voir <a href="http://www.techheadbrothers.com/DesktopDefault.aspx?tabindex=1&tabid=7&AId=68" title="article sur TechHeadBrother de Pierre Lagarde"> l'article de Pierre Lagarde</a></p>
<h3>Les problèmes</h3>
<ul>
<li>Il y a un gros problème avec cette méthode quand on l'utilise sur des drops, c'est que si on fait un postback classique, Me.DropDownList2.SelectedItem
sera égale à la valeur du dernier postback, ce qui s'explique par le fait que le drop a été construit
coté javascript, donc on ne peut pas accéder à toute les valeurs du drop, juste
la valeur selectionné, en faisant un Me.Request(Me.DropDownList2.ClientID)</li>
<li>Le deuxieme problème qui n'en est pas vraiment un, c'est que cette méthode et relativement
compliqué à mettre en oeuvre, il est également trés compliqué de faire cohabiter
une méthode par postback et par un ClientCallBack</li>
</ul>
<h3>La suite ?</h3>
<p>Dans cet exemple, j'ai mis un bouton pour afficher, les resultats de la deuxieme selectionné, ceci dans le but de montrer une facon de faire cohabiter les deux méthodes. Pour voir si vous avez bien compris le fonctionnement, essayez d'afficher la selection lors d'un changement sur le deuxieme drop</p>
</asp:Content>
'NouvelleMethode.aspx.vb
Partial Class NouvelleMethode
Inherits System.Web.UI.Page
Implements ICallbackEventHandler
Private Element(3) As String
Private SousElement(3)() As String
Private Sub ConstructTableau()
If Not Page.IsPostBack Then
'Construction du tableau de tableau
For i As Integer = 0 To 3
Element(i) = "Element" & i.ToString
ReDim SousElement(i)(9)
For j As Integer = 0 To 9
SousElement(i)(j) = i.ToString & " - " & j.ToString
Next
Next
'On met le tableau de tableau dans la variable de session
Session("souselement") = SousElement
Me.DropDownList1.DataSource = Element
Me.DropDownList1.DataBind()
End If
End Sub
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
ConstructTableau()
'Affichage de l'heure de la derniere requete.
Literal1.Text = "La derniere requete s'est effectué à " & Now.ToLongTimeString
Session("test") = "test"
' Ecriture du ClientCallBack
Dim cbref As String = Page.ClientScript.GetCallbackEventReference(Me, _
"document.getElementById ('" & Me.DropDownList1.ClientID & "').value", _
"__onCallbackTermine", "null", False)
Me.DropDownList1.Attributes.Add("onchange", cbref + ";return false;")
Me.ClientScript.RegisterStartupScript(GetType(NouvelleMethode), "__onCallbackTermine", "function __onCallbackTermine (result, context){document.getElementById('" & Me.DropDownList2.ClientID & "').outerHTML = result;}", True)
End Sub
Public Function RaiseCallbackEvent(ByVal eventArgument As String) As String Implements System.Web.UI.ICallbackEventHandler.RaiseCallbackEvent
'Recupere le tableau de tableau a partir de la variable de session
SousElement = Session("souselement")
Me.DropDownList2.DataSource = SousElement(CInt(Right(eventArgument, 1)))
Me.DropDownList2.DataBind()
Dim sw As New System.IO.StringWriter()
Dim htw As New HtmlTextWriter(sw)
Me.DropDownList2.RenderControl(htw)
htw.Flush()
Return sw.ToString()
End Function
Protected Sub Button1_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles Button1.Click
Literal2.Text = " Vous avez selectionné l'element N° " & DropDownList1.SelectedIndex & " et le sous element " & DropDownList2.SelectedIndex
Literal2.Text = Me.Request(Me.DropDownList2.UniqueID)
End Sub
End Class
Conclusion
Pour voir l'exemple il suffit de dezipper dans un dossier, puis d'ouvrir le sln avec VS 2005 ou Visual Web Developer, j'ai pas testé en .net 1.1 mais la page anciennemethode.aspx devrait fonctionner.
J'essayerais de mettre a disposition sur le net ces deux exemples, et peut etre d'en rajouter un, un peu plus concret.
Pour les exemples :
http://cyril.dnsalias.com:83/Exemples/ClientCall Back/NouvelleMethode.aspx 'Avec ClientCallBack
ou
http://cyril.dnsalias.com:83/E xemples/ClientCallBack/AncienneMethode.aspx 'Sans ClientCallBack
j'attends vos feedbacks
Historique
- 07 mai 2005 00:15:03 :
- 13 mai 2005 21:09:18 :
- Mis à jour zip
- 13 mai 2005 21:19:43 :
- Mis à jour du zip
- 13 mai 2005 21:32:57 :
- Mis à jour Zip
- 13 mai 2005 21:51:20 :
- Mis à jour Zip
- 13 mai 2005 22:14:06 :
- mis à jour zip
- 23 mai 2005 09:38:15 :
- MAJ
Sources du même auteur
Sources de la même categorie
Commentaires et avis
Discussions en rapport avec ce code source dans le forum
Dropdownlist extensible [ par beny1303 ]
Bonjour,Je souhaite obtenir une liste déroulante dont la liste s'étend en largeur en fonction de la longueur du texte (dans modifier le largeur du con
Comment récupérer l'élément sélectionné d'un Dropdownlist dans une fenetre Ajax Modal [ par ndry ]
Salut a tous, Je voudrais recupérer l'élément sélectioné d'un composant Dropdownlist dans un dans une fenetre Modal et j'ai utilisé les composants Aja
Mettre à jour les données d'un DropDownList en fonction du choix d'un autre DropDownList [ par Sardonnen ]
bonjourj'aimerais savoir comment faire en AS.NET V1 la mise à jour des données d'un dropdownlist en fonction du choix d'une sélection d
recuperation de parametre [ par mav2 ]
Bonjour,je suis en train de developper une application en .NET et j'utilise dedans plusieurs langages a savoir C#, asp, javascript et Ajax.Mon problem
Ajax [ par haoumalik44 ]
Bonjour à tous, <p class="MsoNor
Gridview en fonction de DropDownList [ par saritanet ]
bonsoir,j voudrais afficher une table liée à la base de donnée selon la valeur choisie par deux DropDownList à laide d'un GriView, pour cela j'ai fait
Fonction javascript [ par some_one ]
Bonjour,J'ai aucune idée sur JavaScript. Mais je veux que vous m'aidiezEn effet, j'ai un textbox et je voudrais implémenter une fonction javascript qu
Problème de manipulation de xml - fonction ReplaceChild ? [ par tataye ]
Bonjour,J'ai un petit souci pour un de mes traitements xml en asp :En gros j'ai un xml1<xml1><champA /><champB>valeur B</champB&g
Uploader un fichier en Ajax [ par gi9592 ]
Salut à tous !J'aurai besoin de votre aide... C'est vraiment urgent !!!Il faut que je fasse un Upload en ajax... Il y a des composantsv(comme EO Web A
|
Derniers Blogs
SIMULER FACILEMENT L'ENVOI DE MAILSIMULER FACILEMENT L'ENVOI DE MAIL par JeremyJeanson
il m'a été demandé, à plusieurs reprises, comment je faisais pour simuler l'envoi de mail lors de mes démos de Workflow Foundation. Ma solution est plutôt simple : j'utilise la configuration par défaut du SmtpClient et j'oriente les mails vers un dossier ...
Cliquez pour lire la suite de l'article par JeremyJeanson VOTEZ POUR LE TOP 10 DES INFLUENCEURS SHAREPOINT FRANCOPHONES !VOTEZ POUR LE TOP 10 DES INFLUENCEURS SHAREPOINT FRANCOPHONES ! par Patrick Guimonet
Si ce n'est déjà fait (comme plus de 600 personnes déjà), il est encore temps de voter pour le concours TOP 10 des influenceurs SharePoint francophones ! Il est organisé par harmon.ie et accessible ici : http://harmon.ie/top-...
Cliquez pour lire la suite de l'article par Patrick Guimonet [CONF'SHAREPOINT] DERNIER RAPPEL ! :-)[CONF'SHAREPOINT] DERNIER RAPPEL ! :-) par Patrick Guimonet
La Conf'SharePoint en chiffres c'est : 3 jours de SharePoint ! 4 parcours et 60 sessions 17 partenaires représentant toutes les fac...
Cliquez pour lire la suite de l'article par Patrick Guimonet [ #SHAREPOINT 2013 ] LES MODèLES DE SITES STANDARDS.[ #SHAREPOINT 2013 ] LES MODèLES DE SITES STANDARDS. par Patrick Guimonet
C'est un point peu mis en avant mais SharePoint 2013 a été l'occasion de remettre de l'ordre dans les modèles de sites. Tout d'abord, un certain nombre de modèles ont été tout simplement rendus obsolètes (cf. Fonctionnalités déco...
Cliquez pour lire la suite de l'article par Patrick Guimonet
Forum
RE : OPENBTSRE : OPENBTS par athenemi
Cliquez pour lire la suite par athenemi RE : OPENBTSRE : OPENBTS par athenemi
Cliquez pour lire la suite par athenemi
Logiciels
Easy-Planning (4.5.0.11)EASY-PLANNING (4.5.0.11)Easy-Planning permet de créer des plannings sous la représentation de diagrammes et est adapté a... Cliquez pour télécharger Easy-Planning CVEasy (3.1.0.51)CVEASY (3.1.0.51)PHMSD-CVEasy est un logiciel d'aide à la rédaction de CV d'une simplicité déconcertante.
PHMSD-C... Cliquez pour télécharger CVEasy LettresFaciles 2011 (8.6.0.31)LETTRESFACILES 2011 (8.6.0.31)LettresFaciles est un logiciel facilitant la création et la rédaction de lettres types.
Son inte... Cliquez pour télécharger LettresFaciles 2011 sDEVIS-FACTURES vlPRO (8.4.2.62)SDEVIS-FACTURES VLPRO (8.4.2.62)sDEVIS-FACTURES vlPRO a été mis au point pour les particuliers, créateurs, entrepreneurs, artisa... Cliquez pour télécharger sDEVIS-FACTURES vlPRO Devis-Factures PHMSD (2.1.0.11)DEVIS-FACTURES PHMSD (2.1.0.11)Configuration minimale
Nécessite Windows™ 2000, XP, Windows 7, 8, Vista (Service Pack à... Cliquez pour télécharger Devis-Factures PHMSD
|