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

AJAX Discussion :

[AJAX] Select multiple avec ajax


Sujet :

AJAX

  1. #1
    Membre à l'essai
    Homme Profil pro
    retraité
    Inscrit en
    Janvier 2015
    Messages
    27
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Bouches du Rhône (Provence Alpes Côte d'Azur)

    Informations professionnelles :
    Activité : retraité

    Informations forums :
    Inscription : Janvier 2015
    Messages : 27
    Points : 18
    Points
    18
    Par défaut [AJAX] Select multiple avec ajax
    Bonjour,

    Je suis en train de faire (pour nom fils) depuis 1 mois un script plutôt gros bricolage en php qui permettra d’évaluer les élèves.

    J’ai utilisé les exemples de script se trouvant sur votre site en particulier en ajax comme ci-dessous ce qui ma permis de rendre l’application plus fluide.

    Afin d’évaluer 2 élèves en même temps , j’ai mis un select multiple.

    Malgré des recherches, je ne sais pas faire les modifications afin qu’il accepte les 2 valeurs et ne me les faire parvenir au script PHP qui ira chercher les TD commun aux 2 élèves.

    J’ai remarqué que l’on utilise beaucoup Jquery mais je voudrais rester sur cette fonction cela me permettra e comprendre et de finir. Je verrai plus tard pour Jquery . Bien sûr si JQuery s’impose allons y.

    Noté que mes connaissance sont maigre et nul en JS et en Ajax.

    Merci pour vos exemples.

    Antoine




    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
    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('sous_competance').innerHTML = leselect;
    		}
    	}
    	// Ici on va voir comment faire du post
    	xhr.open("POST","Ajax/ajax_eval_eleve.php",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 l'auteur
    	sel = document.getElementById('categorie');
    	idcategorie = sel.options[sel.selectedIndex].value;
    	xhr.send("id_Categorie="+idcategorie);
    }
    Le select

    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    <select name="nom[]"  size="8" multiple id="categorie" onchange= "go()" >';

  2. #2
    Rédacteur/Modérateur
    Avatar de andry.aime
    Homme Profil pro
    Inscrit en
    Septembre 2007
    Messages
    8 391
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : Ile Maurice

    Informations forums :
    Inscription : Septembre 2007
    Messages : 8 391
    Points : 15 059
    Points
    15 059
    Par défaut
    Bonjour,

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    idcategorie = sel.options[sel.selectedIndex].value;
    xhr.send("id_Categorie="+idcategorie);
    utilise quelque chose comme ça à la place:

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    var nom = "";
    for ( i=0 ; i<  sel.options.length;  i++)
    {
       if(sel.options[i].selected) nom += "nom[]=" + sel.options[i].value +"&"
    }
    xhr.send(nom);
    Coté php, $_POST["nom"] sera un array.

    A+.

  3. #3
    Membre à l'essai
    Homme Profil pro
    retraité
    Inscrit en
    Janvier 2015
    Messages
    27
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Bouches du Rhône (Provence Alpes Côte d'Azur)

    Informations professionnelles :
    Activité : retraité

    Informations forums :
    Inscription : Janvier 2015
    Messages : 27
    Points : 18
    Points
    18
    Par défaut
    Tout d’abord merci pour la réponse.

    Malheureusement cela ne fonctionne pas.

    En effet, rien ne s'affiche dans le div. Il doit y avoir une erreur dans le js. J'ai bricolé, je n'arrive vraiment pas à me faire au js.

    Si vous avez d'autres idées, merci d'avance.

    Antoine

  4. #4
    Membre à l'essai
    Homme Profil pro
    retraité
    Inscrit en
    Janvier 2015
    Messages
    27
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Bouches du Rhône (Provence Alpes Côte d'Azur)

    Informations professionnelles :
    Activité : retraité

    Informations forums :
    Inscription : Janvier 2015
    Messages : 27
    Points : 18
    Points
    18
    Par défaut
    Bonsoir,

    j'ai tourné le script mais je ne trouve pas de solution.

    en avez vous?

    Merci

  5. #5
    Rédacteur/Modérateur
    Avatar de andry.aime
    Homme Profil pro
    Inscrit en
    Septembre 2007
    Messages
    8 391
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : Ile Maurice

    Informations forums :
    Inscription : Septembre 2007
    Messages : 8 391
    Points : 15 059
    Points
    15 059
    Par défaut
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    if(xhr.readyState == 4 && xhr.status == 200){
    			leselect = xhr.responseText;
    			// On se sert de innerHTML pour rajouter les options a la liste
    			document.getElementById('sous_competance').innerHTML = leselect;
    		}
    Remplace par
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    if(xhr.readyState == 4 ){
        if (xhr.status == 200 || xhr.status == 0){
            // On se sert de innerHTML pour rajouter les options à la liste 
            leSelect = xhr.responseText;
            document.getElementById('sous_competance').innerHTML = leselect;
        }
        else{
            alert( "Erreur : " + xhr.status + " " + xhr.statusText);
        }
    }
    Instale firebug sur firefox ou utilise l'outils de développement sur chrome et décrit nous les erreurs.

    A+.

  6. #6
    Membre à l'essai
    Homme Profil pro
    retraité
    Inscrit en
    Janvier 2015
    Messages
    27
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Bouches du Rhône (Provence Alpes Côte d'Azur)

    Informations professionnelles :
    Activité : retraité

    Informations forums :
    Inscription : Janvier 2015
    Messages : 27
    Points : 18
    Points
    18
    Par défaut
    Merci pour vos réponses.

    J’ai utilisé Chrome.

    Sur la version qui fonctionne j’ai corrigé toutes les erreurs JS et autres.
    Puis j’ai mis la version JS Ajax qui pose problème.

    Le débogueur met les erreurs suivantes

    “Uncaught SyntaxError: Unexpected end of input”

    qui se rapporte au début de script JS
    Je l’ai enlevé et l’erreur se présente sur
    et ainsi de suite.

    Et à chaque click sur un élève

    “Uncaught ReferenceError: go is not defined”

    qui se rapporte à
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
     
    <select name="nom[]"  size="8" multiple id="categorie" onchange= "go()" >


    Merci pour vos réponses et votre patience.

  7. #7
    Rédacteur/Modérateur
    Avatar de andry.aime
    Homme Profil pro
    Inscrit en
    Septembre 2007
    Messages
    8 391
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : Ile Maurice

    Informations forums :
    Inscription : Septembre 2007
    Messages : 8 391
    Points : 15 059
    Points
    15 059
    Par défaut
    “Uncaught ReferenceError: go is not defined”
    C'est qu'il n'arrive pas à trouver la fonction go(). Si c'est dans un fichier JS, vérifie bien comment tu l'inclus dans la page.

    A+.

  8. #8
    Membre à l'essai
    Homme Profil pro
    retraité
    Inscrit en
    Janvier 2015
    Messages
    27
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Bouches du Rhône (Provence Alpes Côte d'Azur)

    Informations professionnelles :
    Activité : retraité

    Informations forums :
    Inscription : Janvier 2015
    Messages : 27
    Points : 18
    Points
    18
    Par défaut
    Bonsoir

    Tout est présent. En fait, je ne change que le script JS l’ancien avec le nouveau c’est tout. Donc le go() lui ne bouge pas .

    J’ai poussé la recherche en mettant tout le script PHP et le JS sur une même page et hors contexte c.à.d. appelée seul.

    Avec l’ancienne version la suite s’ouvre bien dans le <div> et aucune erreur dans la page.
    Avec la nouvelle rien ne s’ouvre et l’ erreur go() apparait.

    Je ne sais pas, c’est un euphémisme !

    Afin de finir, je vais reprendre le script en php avec OnChange >> submit , avec un hidden.

    MAIS, je reste tout de même à votre disposition afin d’essayer d’autre proposition afin de ne pas rester sur un échec.

    En effet, c’est la partie la plus importe de l’application « l’évaluation » sur 10 critères. Afin de ne pas avoir de rechargement de page à chaque demande, je voulais du 100% ajax (script copier sur votre site) afin que l’affichage soit plus agréable. Mais bon…

    Merci à vous et à bientôt peut être.

    Antoine

Discussions similaires

  1. [AJAX] Select multiple de ajax à php
    Par senacle dans le forum Général JavaScript
    Réponses: 3
    Dernier message: 29/06/2018, 16h23
  2. [AJAX] Select imbriqué avec Ajax
    Par anissa2 dans le forum AJAX
    Réponses: 1
    Dernier message: 22/04/2013, 19h09
  3. [AJAX] SELECT dynamique avec Ajax et Javascript
    Par staff85 dans le forum AJAX
    Réponses: 4
    Dernier message: 22/10/2010, 16h31
  4. Moteur de recherche avec "select multiple" dynamique AJAX
    Par enclave_51 dans le forum Général JavaScript
    Réponses: 1
    Dernier message: 16/07/2008, 16h21
  5. [AJAX] upload multiple avec (fancy upload)
    Par sculpteur dans le forum Général JavaScript
    Réponses: 5
    Dernier message: 20/12/2007, 17h55

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