Discussion :

[Bugsounet]

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

[Bugsounet]

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 ?

[Bugsounet]

Donc je continue,

ALors je me suis rendu compte que bêtement le

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
k.value = i;

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

J'ai donc rajouté un

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
k.texte = i;

Je ne comprends pas pourquoi ma liste est vide..

[OSdave]

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, @+

[sn4ke]

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

[dream_of_australia]

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