Discussion :

[hapalemur]

Bonjour,
J'ai une ComboBox alimentée par un ItemFileReadStore, qui récupère n-ligne à partir du serveur. Le problème est d'affecter une couleur bien précise (parmi 4 : red, blue, green, black) à chaque ligne. La couleur est définie au niveau du serveur.
D'ou la question :
- la chose est-elle réalisable dans une ComboBox?
- si oui, la couleur peut-elle être définie directement au niveau du serveur ou faut-il effectuer un traitement sur le store dans la page web?
Merci de vos éclaircissements.

[Daniel_Gibot]

Bonjour,

Oui c'est tout a fait réalisable :

En partant d'un contenu json :

Important : il faut un "label" et un "name". Le premier servira à l'affichage de la liste déroulante et le deuxième à la valeur affichée à la sélection.

Code :

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

1
2
3
4
5
6
7
8
9
10
11
 
{
  identifier:"abbreviation",
  label: "label",
  items: [
	{name:"Alabama", label:"<font color='red'>Alabama</font>",abbreviation:"AL"},
	{name:"Alaska", label:"<font color='green'>Alaska</font>",abbreviation:"AK"},
	{name:"American Samoa", label:"American Samoa",abbreviation:"AS"},
	{name:"Arizona", label:"Arizona",abbreviation:"AZ"}
]
}

Code programmatique du comboBox :

Je me suis basé sur un exemple de comboBox sur le site de dojoToolkit.
L'important dans cette partie c'est :
- "labelType" qui, renseigné avec "html", permet l'utilisation des balises pour l'affichage des couleurs. Toutefois, ce n'est que lorsque l'on affiche la liste déroulante.
- "labelAttr" qui va récupérer la valeur contenue dans "label" (à savoir la version html avec couleur de ce que l'on souhaite afficher).
- "searchAttr" : qui va afficher la valeur contenue dans "name" (sans les balises) autrement le résultat de la sélection est affiché avec les balises.

Code :

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

1
2
3
4
5
6
7
8
9
10
11
var filteringSelect = new dijit.form.ComboBox({
	id: "stateSelect",
	name: "state",
	value: "Kentucky",
	store: stateStore,
	labelType: 'html',
	labelAttr: 'label',
	searchAttr: "name"
},
"stateSelect");

[hapalemur]

Hello Daniel,
Très clair comme explication; comme mes données pour le itemFileReadStore étaient déjà au format JSON, je n'ai eu qu'à construire et ajouter le champ "label" au fichier et à renseigner la ComboBox avec les bonnes propriétés.
Et çà marche.
Dernier petit souci, si pour la sélection j'affiche bien les lignes dans les différentes couleurs, l'élément sélectionné qui est remonté dans la zone d'affichage reste en noir.
Donc si je veux afficher la couleur associé à cet item, il faut que sur un événement onChange j'associe une fonction qui va parcourir le store et récupérer un identifiant de couleur puis modifier une propriété de la ComboBox; mais je ne vois pas quelle est la propriété concernée.
Peut-être la propriété style?
En tout cas merci pour l'aide.