begin process at 2013 05 23 07:11:41
  Trouver un code source :
 
dans
 
Accueil > 

Code

 > 

ASP.Net

 > .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

Note :
4,67 / 10 - par 3 personnes
4,67 / 10

  • 1

  • 2

  • 3

  • 4

  • 5

  • 6

  • 7

  • 8

  • 9

  • 10
Catégorie :ASP.Net Source .NET ( DotNet ) Classé sous :dropdownlist, fonction, autre, clientcallback, ajax Niveau :Initié Date de création :06/05/2005 Date de mise à jour :23/05/2005 09:38:15 Vu / téléchargé :15 971 / 643

Auteur : jesusonline

Ecrire un message privé
Site perso
Ce membre participe au partage de revenus publicitaires
Commentaire sur cette source (4)
Ajouter un commentaire et/ou une note


 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

 Fichier Zip

Les Membres Club peuvent télécharger directement un fichier contenu dans le zip sans télécharger le zip en entier !

Télécharger le zip


 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

Source avec Zip Source .NET (Dotnet) UTILISATION DE LA MÉTHODE SORT ET SORTDIRECTION AVEC UN GRID...
Source .NET (Dotnet) RESPONSE.FILTER : MANIPULATION DU STREAM DE SORTIE ASP.NET
Source avec Zip Source .NET (Dotnet) OPTIMISATION DE LA SERIALISATION JSON POUR LES LIST<T>
Source avec Zip Source .NET (Dotnet) CRAWLABLELINKBUTTON : UPDATEPANEL ET RÉFÉRENCEMENT
Source .NET (Dotnet) POSTBACKCONTROL - COMMUNICATION CLIENT/SERVEUR AVEC LES UPDA...

 Sources de la même categorie

CHARGER LE DROPDOWNLIST AVEC DEUX TABLES par nsegi
Source avec Zip Source .NET (Dotnet) GUESTBOOK AVEC GRIDVIEW par DanMor498
Source avec Zip CHECKED DROPDOWNLIST par fredzool
Source avec Zip Source avec une capture Source .NET (Dotnet) GRIDVIEW WITH TREEVIEW AND CALLBACK par fredzool
Source avec Zip APPELLER UN WEBSERVICE DEPUIS JAVASCRIPT par fredzool

 Sources en rapport avec celle ci

CREATION D'UN AUTOCOMPLETE JQUERY AVEC UN CODE SOURCE ASP ET... par dedebis84
Source avec Zip Source avec une capture Source .NET (Dotnet) UN WEBCONTROL : LE CALLBACKBUTTON par cYoann
Source avec Zip Source .NET (Dotnet) AJAX ET DROPDOWNLIST par ivanoff1
Source avec Zip Source .NET (Dotnet) .NET 2 - UTILISATION DU CLIENTCALLBACK AU SEIN D'UN CONTROLE... par jesusonline
Source .NET (Dotnet) RECUPERER LE RENDU D'UN CONTROLE par jesusonline

Commentaires et avis

Commentaire de Djedie le 15/03/2007 10:21:23

Les liens des exemples de sont plus valides :(

Je ne connais aps le VB, aurais-tu une version C# de dispo pour ce code?
Je saurai rajouter les ; mais certians bouts de codes sont trop differents (ex : "Dim cbref As String").

Merci

Commentaire de PuNishieuse le 21/03/2007 15:31:15

@Djedie
Ci-dessous une bonne adresse pour convertir des bouts de codes:
http://www.carlosag.net/Tools/CodeTranslator/Default.aspx

VB.NET: Dim cbref As String
C#:     string cbref;

Certaines parties de codes ne sont pas très bien converties mais le gros est bon.

Commentaire de megadmini le 27/03/2008 10:47:37

Merci Beaucoup pour ce source!
Mais quand j'ai l'executé sur mon Pc il m'a donné cette Erreur :
"Class 'NouvelleMethode' doit implémenter 'Function GetCallbackResult() As String' pour l'interface 'System.Web.UI"

Repond Moi SVP car je besoin de ce code!

Commentaire de megadmini le 27/03/2008 10:50:19

Désolés mais j'ai oublié de mettre les autres Erreurs :
Erreur 2 Class 'NouvelleMethode' doit implémenter 'Sub RaiseCallbackEvent(eventArgument As String)' pour l'interface 'System.Web.UI.ICallbackEventHandler'
Erreur 3 'RaiseCallbackEvent' ne peut pas implémenter 'RaiseCallbackEvent', car il n'existe pas de function correspondant pour l'interface 'System.Web.UI.ICallbackEventHandler'

Merci d'avant!

 Ajouter un commentaire


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 &#224; jour des donn&#233;es d'un dropdownlist en fonction du choix d'une s&#233;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&lt;xml1&gt;&lt;champA /&gt;&lt;champB&gt;valeur B&lt;/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


Nos sponsors


Sondage...

CalendriCode

Mai 2013
LMMJVSD
  12345
6789101112
13141516171819
20212223242526
2728293031  

Consulter la suite du CalendriCode

Photothèque

A découvrir



 
Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel (EBArtSoft), Merci à Vincent pour ses précieux conseils.
CodeS-SourceS.com© Toute reproduction même partielle est interdite sauf accord écrit du Webmaster
CodeS-SourceS.com© est une marque déposée tous droits réservés

Google Coop CodeS-SourceS Google Coop CodeS-SourceS
Temps d'éxécution de la page : 2,995 sec (4)

Nous contacter | Annoncer sur CodeS-SourceS | Mentions légales