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

Bibliothèques & Frameworks Discussion :

Inline modification : ajout d'une liste


Sujet :

Bibliothèques & Frameworks

  1. #1
    Candidat au Club
    Inscrit en
    Mars 2007
    Messages
    3
    Détails du profil
    Informations forums :
    Inscription : Mars 2007
    Messages : 3
    Par défaut Inline modification : ajout d'une liste
    Bonjour,

    Je fais suite en fait au tutorial de Oliver Lance sur la modification Inline en ajax.
    Je l'utilise, il marche parfaitement mais j'aurais besoin en fait de l'étendre dans ses fonctionnalités.

    Mon but serait lorsque je double clic, qu'il affiche une liste déroulante avec des informations récupérées d'une base de données et lorsque je sors du focus, il me mette ce que j'ai sélectionné (enfin même principe que pour un simple input ou textearea).

    J'ai essayé depuis son script de créer un select, puis d'y ajouter des options. Je me heurte déjà tout au début au fait que je n'arrive pas à adjoindre au select une ID, ce que me permettrait d'adjoindre à ce select les balises options. J'ai essayé la méthode setattribute() mais cela ne marche pas. J'ai un peu recherché et il semble que IE6 à du mal avec cela.

    J'arrive à créer la liste (le select) mais bien sur sans balise option c'est vide et curieusement il ne me permet pas de sortir du focus et je reste bloqué sur la liste (deuxième problème potentiel).

    Je précise que je n'ai besoin que d'une compatibilité sur IE6 windows.

    Est ce que vous avez des idées ???

    Merci beaucoup

  2. #2
    Candidat au Club
    Inscrit en
    Mars 2007
    Messages
    3
    Détails du profil
    Informations forums :
    Inscription : Mars 2007
    Messages : 3
    Par défaut Suite
    Bonjour à nouveau,

    Donc je progesse un peu...

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
     
    // valeur de type liste déroulante
    		case "liste":
    		input = document.createElement("select");
     
    		for (i=0;i<5;i++)
    		{
    		var k = document.createElement("option");
    		k.value = i;
    		input.appendChild(k);
    		}
    Ci dessus le code dans la continuité du tutorial. Je créé donc le select et pour le moment je tente d'ajouter via une boucle 4 élement option.

    Le résultat est que lorsqu eje double clic j'ai bien une liste de 4 options mais la liste est vide. Est ce que vous savez pourquoi, la liste est vide ?

  3. #3
    Candidat au Club
    Inscrit en
    Mars 2007
    Messages
    3
    Détails du profil
    Informations forums :
    Inscription : Mars 2007
    Messages : 3
    Par défaut
    Donc je continue,

    ALors je me suis rendu compte que bêtement le

    ne donnait que la valeur mais pas ce qui apparait entre les balises "option"

    J'ai donc rajouté un
    Je ne comprends pas pourquoi ma liste est vide..


  4. #4
    Nouveau membre du Club
    Inscrit en
    Janvier 2007
    Messages
    7
    Détails du profil
    Informations forums :
    Inscription : Janvier 2007
    Messages : 7
    Par défaut ya moyen?
    Salut,
    désolé de repêcher ce sujet d'il y a 3 mois, mais je voudrais faire +/- la même chose et je voulais savoir si vous étiez arrivé à un résultat, histoire d'éviter de réinventer la roue.

    Je dis plus ou moins parce que, premièrement, pour moi la compatibilité est plutôt orientée à Firefox, bien que si ça marche aussi sur IE c'est pas plus mal.
    Et, deuxiêmement, d'après le code je pense que vous avez appliqué la première partie du tutorial, tandis que je me suis basé sur la seconde, avec l'utilisation de classes.

    Merci, @+

  5. #5
    Nouveau candidat au Club
    Inscrit en
    Juillet 2007
    Messages
    3
    Détails du profil
    Informations forums :
    Inscription : Juillet 2007
    Messages : 3
    Par défaut
    Débutant en Javascript, j'ai réussi (plus ou moins) à créer une classe pour faire un select.

    Celle-ci est evidemment basé très fortement sur les classes fourni par le tutorial. Il doit y avoir des manières bien plus simple de faire autrement.
    En effet, j'utilise 2 tableaux, passés en paramètres, un pour les value et un pour les libellés des différents options du select.
    (ne pas oublier d'utiliser une fonction convertissant les tableaux php en tableau Javascript (tab1 et tab2 dans l'utilisation ci-dessous))

    Utilisation :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    <td id=\"descr-".$num."\" class=\"cellule\" ondblclick=\"inlineMod(".$num.", this, 'idp', 'Selection',tab1,tab2)\">".$nom."</td></tr>";
    Néanmoins, j'ai un léger souci, après la selection, (la modification est effectuée sans problème), la valeur de l'option s'affiche, alors que j'aimerai avoir le texte. Après refresh de la page, l'affichage est correct.
    (Je ne peux pas utiliser les mêmes valeurs pour value et text du select).

    Merci
    Fichiers attachés Fichiers attachés

  6. #6
    Membre confirmé Avatar de dream_of_australia
    Profil pro
    Inscrit en
    Juin 2007
    Messages
    167
    Détails du profil
    Informations personnelles :
    Âge : 41
    Localisation : France, Alpes Maritimes (Provence Alpes Côte d'Azur)

    Informations forums :
    Inscription : Juin 2007
    Messages : 167
    Par défaut
    J'ai une solution au problème évoqué par sn4ke, je vous donne ici le code de la fonction terminerEdition de la classe ListeDeroulante :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    ListeDeroulante.prototype.terminerEdition = function() {
    this.parent.replaceChild(document.createTextNode(liste.options[liste.selectedIndex].text), this.parent.firstChild) ;
    	delete liste ;
    }
    Vous avez simplement besoin de remplacer ListeDeroulante par votre nom de classe à vous, et liste par votre appellation également (input pour Bugsounet par exemple).

    Avec ce code, après le choix d'une option dans la liste, c'est bien le texte de l'option qui apparaît et non sa valeur

  7. #7
    Membre confirmé Avatar de dream_of_australia
    Profil pro
    Inscrit en
    Juin 2007
    Messages
    167
    Détails du profil
    Informations personnelles :
    Âge : 41
    Localisation : France, Alpes Maritimes (Provence Alpes Côte d'Azur)

    Informations forums :
    Inscription : Juin 2007
    Messages : 167
    Par défaut
    Par contre je voudrais savoir si ce que vous avez fait fonctionne sous IE, parce que moi la liste déroulante qui apparaît est vide sous IE, alors que sous Firefox ça fonctionne très bien. C'est d'ailleurs peut-être le souci de Bugsounet.

  8. #8
    Membre confirmé Avatar de dream_of_australia
    Profil pro
    Inscrit en
    Juin 2007
    Messages
    167
    Détails du profil
    Informations personnelles :
    Âge : 41
    Localisation : France, Alpes Maritimes (Provence Alpes Côte d'Azur)

    Informations forums :
    Inscription : Juin 2007
    Messages : 167
    Par défaut
    Très étonnant ! La liste sous IE est composée d'éléments vides, mais lorsque je clique sur un des éléments de la liste la modification est bien effectuée avec la bonne valeur et après rafraîchissement de la page le texte de la cellule s'actualise avec la bonne donnée.

    Donc apparemment c'est juste le text des options qui ne s'affiche pas, leurs values sont bonnes. Et la réactualisation du texte de la cellule ne fonctionne pas sur le coup, il faut rafraîchir la page.

    Je mets ici la fonction qui créé la liste déroulante, le souci doit venir de là :
    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
    ListeDeroulante.prototype.remplacerTexte = function (parent, sauvegarde, tab) {
    	if (!parent || !sauvegarde) return false ;
    	else this.parent = parent ;
    	liste = document.createElement("select") ;
    	liste.appendChild(document.createElement("option")) ;
    	for (i = 0 ; i < tab.length ; i++) {
    		var k = document.createElement("option");
    		k.value = tab[i][0] ;
    		k.text = tab[i][1] ;
    		liste.appendChild(k);
    	}
    	liste.onchange = function() {
    		sauvegarde() ;
    	} ;
    	parent.replaceChild(liste, parent.firstChild) ;
    }
    Quelqu'un a-t-il une idée ?

  9. #9
    Membre confirmé Avatar de dream_of_australia
    Profil pro
    Inscrit en
    Juin 2007
    Messages
    167
    Détails du profil
    Informations personnelles :
    Âge : 41
    Localisation : France, Alpes Maritimes (Provence Alpes Côte d'Azur)

    Informations forums :
    Inscription : Juin 2007
    Messages : 167
    Par défaut
    Problème résolu sous IE, mais maintenant c'est sous Firefox que ça plante.

    Dans la boucle for de la fonction remplacerTexte :

    Ce qui marche pour IE :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    var k = new Option(tab[i][1],tab[i][0]);
    liste.add(k);
    Ce qui marche pour Firefox :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    var k = document.createElement("option");
    k.value = tab[i][0] ;
    k.text = tab[i][1] ;
    liste.appendChild(k);
    Sachant que je n'ai qu'un seul tab qui contient pour chaque ligne à l'index 0 la valeur de l'option, et à l'index 1 son texte.

    Comment faire pour mettre le code ci-dessus en fonction du navigateur ?

  10. #10
    Membre confirmé Avatar de dream_of_australia
    Profil pro
    Inscrit en
    Juin 2007
    Messages
    167
    Détails du profil
    Informations personnelles :
    Âge : 41
    Localisation : France, Alpes Maritimes (Provence Alpes Côte d'Azur)

    Informations forums :
    Inscription : Juin 2007
    Messages : 167
    Par défaut
    Voilà quelque chose qui marche chez moi pour les deux navigateurs IE et FF, mais à mon avis pas pour toutes les versions, ça manque de robustesse.
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    var k ;
    for (i = 0 ; i < tab.length ; i++) {
    	if (navigator.appName == "Microsoft Internet Explorer") {
    		k = new Option(tab[i][1],tab[i][0]);
    		liste.add(k);
    	}
    	else {
    		var k = document.createElement("option");
    		k.value = tab[i][0] ;
    		k.text = tab[i][1] ;
    		liste.appendChild(k) ;
    	}
    }
    Est-ce que quelqu'un a un test plus fiable du navigateur ? Merci !

  11. #11
    Nouveau candidat au Club
    Inscrit en
    Juillet 2007
    Messages
    3
    Détails du profil
    Informations forums :
    Inscription : Juillet 2007
    Messages : 3
    Par défaut
    Merci de ta réponse dream_of_australia, ca marche bien.
    Pour ton test, il me semble qu'il n'y a qu'avec cette fonction que tu peux récupérer le nom du navigateur.
    Ton test est valide pour toutes les versions de IE à partir de la 4, donc normalement aucun problème...
    Merci

  12. #12
    Nouveau membre du Club
    Inscrit en
    Janvier 2007
    Messages
    7
    Détails du profil
    Informations forums :
    Inscription : Janvier 2007
    Messages : 7
    Par défaut
    Citation Envoyé par dream_of_australia
    Est-ce que quelqu'un a un test plus fiable du navigateur ? Merci !
    Salut, pour éviter de devoir tester le navigateur tu peux employer k.innerHTML, qui fonctionne sous IE et FF.
    bon code

  13. #13
    Nouveau candidat au Club
    Inscrit en
    Juillet 2007
    Messages
    3
    Détails du profil
    Informations forums :
    Inscription : Juillet 2007
    Messages : 3
    Par défaut
    Bonjour,

    j'ai actuellement un autre problème, et je reposte ici car ca concerne la classe d'ajout de liste pour la modification inline.

    En effet, après avoir implémenté la liste pour la modification, j'ai voulu ajouter dans ma page une gestion de hide/show avec scriptaculous.

    A partir de là tout marche séparement mais malheureusement pas ensemble.

    Dès que j'ajoute les bibliothèques scriptaculous, et prototype, la liste qui s'affiche pour la modification inline contient des fonctions de la bibiothèque prototype...

    Voila j'espère avoir été assez clair (dans le cas contraire, signaler le moi, j'essaierai d'être plus clair) , si quelqu'un a eu le même problème et a réussi a le résoudre, ca m'interresse fortement.

    Merci.

Discussions similaires

  1. Réponses: 3
    Dernier message: 26/08/2006, 14h03
  2. Ajout dans une liste déroulante
    Par auriolbeach dans le forum Access
    Réponses: 5
    Dernier message: 16/02/2006, 05h37
  3. Ajout dans une liste avec un bouton
    Par Invité dans le forum Access
    Réponses: 6
    Dernier message: 07/12/2005, 08h27
  4. Ajout dans une liste/vérification
    Par illight dans le forum Access
    Réponses: 1
    Dernier message: 11/10/2005, 17h12
  5. [LG]probleme d'ajout dans une liste chainée...
    Par misteryann dans le forum Langage
    Réponses: 5
    Dernier message: 08/03/2004, 20h28

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