IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

Struts 2 Java Discussion :

[AJAX] Select qui dépend d'une autre ? filtrage


Sujet :

Struts 2 Java

  1. #1
    Membre éclairé
    Profil pro
    Inscrit en
    Décembre 2008
    Messages
    292
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Décembre 2008
    Messages : 292
    Par défaut [AJAX] Select qui dépend d'une autre ? filtrage
    Bonjour,
    je commence à peine à travailler avec Struts2, je cherche à lier 2 select entre eux en utilisant Ajax,
    j'ai utilisé un exemple sur ce lien mais le résultat est catastrophique.
    le second select est remplacé par la totalité de la page,
    Voilà mon code JSP:
    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
     
    <script type="text/javascript"">
      function getXhr(){
    	var xhr = null; 
    	if(window.XMLHttpRequest) // Firefox et autres
    	    xhr = new XMLHttpRequest(); 
    	else if(window.ActiveXObject){ // Internet Explorer 
    		try {
    			 xhr = new ActiveXObject("Msxml2.XMLHTTP");
    		} catch (e) {
    			xhr = new ActiveXObject("Microsoft.XMLHTTP");
    		}
    		}
    	else { // XMLHttpRequest non supporté par le navigateur 
    		alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest..."); 
    		xhr = false; 
    	} 
    	return xhr;
      }
     
    /**
    * Méthode qui sera appelée sur le click du bouton
    */
      function go(){
    	var xhr = getXhr();
    	// On défini ce qu'on va faire quand on aura la réponse
    	xhr.onreadystatechange = function(){
    		// On ne fait quelque chose que si on a tout reçu et que le serveur est ok
    		if(xhr.readyState == 4 && xhr.status == 200){
    			leselect = xhr.responseText;
    			// On se sert de innerHTML pour rajouter les options a la liste
    			document.getElementById('secondSelect').innerHTML = leselect;
    		}
    	}
    	// Ici on va voir comment faire du post
    	xhr.open("POST","url.methode.action",true);
    	// ne pas oublier ça pour le post
    	xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
    	// ne pas oublier de poster les arguments
    	// ici, l'id de la valeur
    	sel = document.getElementById('firstSelect');
    	valeur = sel.options[sel.selectedIndex].value;
    	xhr.send("valeur="+valeurFirstSelect);
      }
    </script>
    ..........
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
     
    <s:select id="firstSelect" name="rechercheBean.firstSelect" list="listeValeurs" 
    	listValue="valeur" listKey="valeur" headerKey="" 
    	headerValue="-- Selectionner une valeur --" onchange="go()">
    </s:select>
    ...............
    <s:select id="secondSelect" name="rechercheBean.secondSelect" 
    	list="listeMvt" listKey="mvtId" listValue="mvtLib" 
    	headerKey="" headerValue="-- Selectionner un mouvement --">
    </s:select>
    le code java de la methode :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
     
    ......
    private String valeur;
    //getter et setter de valeur
    ......
    public String methode() {
       listeMvt= ..... // j'obtiens la liste des mvt en fonction de la valeur
       .......
       return INPUT;// vers la meme page jsp
    }
    juste pour précision : au moment de l'initialisation de la page, j'ai dans les 2 select toutes les valeurs avec tous les mouvements,
    Si quelqu'un à une idée, j'en serais très reconnaissant !!
    Merci

  2. #2
    Membre actif
    Homme Profil pro
    Développeur Java
    Inscrit en
    Décembre 2008
    Messages
    89
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 38
    Localisation : France, Hauts de Seine (Île de France)

    Informations professionnelles :
    Activité : Développeur Java
    Secteur : Services à domicile

    Informations forums :
    Inscription : Décembre 2008
    Messages : 89
    Par défaut
    Bonjour,

    le problème (a mon avis) vient de ton xhr.responseText qui doit prendre la totalité du HTML de ta page, vérifie bien tes balises.

  3. #3
    Membre éclairé
    Profil pro
    Inscrit en
    Décembre 2008
    Messages
    292
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Décembre 2008
    Messages : 292
    Par défaut
    Merci pour ta réponse rapide,
    mais tu peut être plus précis ?
    si j'ai bien compris :
    dans ma méthode java je renvoi INPUT, effectivement il renvoie la page jsp (si je te suis bien),
    donc, il faut que la liste du 2 select ??? et comment ?

  4. #4
    Membre actif
    Homme Profil pro
    Développeur Java
    Inscrit en
    Décembre 2008
    Messages
    89
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 38
    Localisation : France, Hauts de Seine (Île de France)

    Informations professionnelles :
    Activité : Développeur Java
    Secteur : Services à domicile

    Informations forums :
    Inscription : Décembre 2008
    Messages : 89
    Par défaut
    Et bien dans cette partie du code :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
     
    leselect = xhr.responseText;
    document.getElementById('secondSelect').innerHTML = leselect;
    la variable "leselect" récupère les informations avec le xhr.responseText pour ensuite remplacer le code HTML de ton deuxième select par celui-ci, et donc si le code HTML récupérer est différent d'un code HTML d'un select ça peut provoquer l'erreur que tu as.

    (ça fait beaucoup de "select" tout ça )

  5. #5
    Membre éclairé
    Profil pro
    Inscrit en
    Décembre 2008
    Messages
    292
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Décembre 2008
    Messages : 292
    Par défaut
    Bon, j'ai trouvé une solution un peu bidon mais qui marche et elle plus facile à comprendre, elle utilise du jquery.
    le mieux c'est de créer une page JSP pour le deuxième select qui va être rafraichi en fonction du premier select.
    la page JSP du 2éme select secondSelect.jsp :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
     
     
    <%@ taglib uri="/struts-tags" prefix="s"%>
    // importer les js et css jquery
    <s:select id="secondSelect" name="rechercheBean.secondSelect" 
    	list="listeMvt" listKey="mvtId" listValue="mvtLib" 
    	headerKey="" headerValue="-- Selectionner un mouvement --" >
    </s:select>
    dans la page principale JSP :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
     
    <script type="text/javascript"">
    function onSelectMouv() { //utilisation de jquery
      var valeurId= $("#firstSelect").val();  
      $("#selectMouv").load("votreActionStruts.action", {"valeurId": valeurId});
    }
    </script>
    ..........
    <s:select id="firstSelect" name="rechercheMouvementBean.firstSelect" list="listeValeurs" listValue="valeur" listKey="valeurId" headerKey="" 
    headerValue="-- Selectionner une valeur --" onchange="javascript:onSelectMouv();"> 
    </s:select>
    <div id="selectMouv" > // l'endroit du 2éme select 
      <jsp:include page="secondSelect.jsp" />
    </div>
    Le plus amusant dans ce code, c'est qu'on peut faire de l'ajax sur n'importe quel composant (balise), je l'est fait sur des tableau displaytag, il suffit de remplacer le code de jsp du 2éme select par celui que vous voulais ajaxé.
    Voilà, je sais, c'est pas propre de créer une jsp pour un select, mais c'est la solution que j'ai trouvé,
    si quel qu'un à mieux je suis preneur.

  6. #6
    Membre averti
    Inscrit en
    Août 2009
    Messages
    26
    Détails du profil
    Informations forums :
    Inscription : Août 2009
    Messages : 26
    Par défaut select avec ajax et struts 2
    bonjour rimas2009
    j'ai un problème similaire de select
    le Firstselect je le remplis moi meme et je veux récupérer la sélection pour remplir le secondSelect
    je suis débutante dans ajax,je travail avec eclipse et mysql,hibernet et struts 2
    1)je ne sais pas comment récuperer la selection dans le firstSelect pour l'envoyé dans la méthode send(...)
    2)pour URL de la methode open("POST",url,true) c'est nomDeLaClasse .java qui traitera le requête ??? cad url=nomClass.java ou c'est nomClass.nomMethode

    si quelqu'un peut m'aider je serai très reconnaissante
    merci d'avance

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. [Débutant] Listbox qui dépend d'une autre listbox.
    Par Jackbalek dans le forum Interfaces Graphiques
    Réponses: 6
    Dernier message: 30/04/2014, 14h24
  2. concevoir une liste qui dépend d'une autre
    Par doomi26 dans le forum Access
    Réponses: 3
    Dernier message: 27/02/2014, 09h27
  3. Insert conditionnel qui dépend d'une autre table
    Par chochatown dans le forum Développement
    Réponses: 1
    Dernier message: 10/02/2011, 17h38
  4. [Toutes versions] liste déroulante qui dépend d'une autre
    Par canary dans le forum Excel
    Réponses: 7
    Dernier message: 18/05/2009, 16h24
  5. Réponses: 13
    Dernier message: 21/11/2005, 17h39

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo