Discussion :

[JujuPomme]

Bonjour à tous,

Je créer actuellement un tableau éditable. J'entends par là, qu'il récupère tout un tas d'information de ma BDD, qu'il me l'affiche. Chaque ligne peut-être ensuite éditée à l'aide d'une fenêtre modale.

Je récupère bien les informations liés à un input pour pré-remplir cette fenêtre modale, mais j'ai un problème sur les select. Je récupère bien la bonne valeur, mais impossible de le pré-remplir dans ma fenêtre modale.

Voici un peu de code : (Ce select là est principalement fait en PHP. Il a été fait par quelqu'un de l'entreprise, et marche très bien.)

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
46
47
48
49
50
51
52
53
54
// combo fin
											$_combo_end = '</select>'."\n";
											// combo liste_types
											$_combo_types = '<select name="type" id="type" class="selectpicker form-control" style="width:100%;" required="true">'."\n";
											$_combo_types.= '<option class="none" value=""> - - - </option>'."\n";
											// combo liste sous-types
											$_combo_soustypes = '<select name="soustype" id="soustype" class="selectpicker form-control" style="width:100%;">'."\n";
											$_combo_soustypes.= '<option class="none" value=""> - - - </option>'."\n";
											// combo liste sous-sous-type
											$_combo_sousoustypes = '<select name="soussoustype" id="soussoustype" class="selectpicker form-control" style="width:100%;">'."\n";
											$_combo_sousoustypes.= '<option class="none" value=""> - - - </option>'."\n";
											// recuperation données
											$listeAction = $mobilecrm->getListeTypesAction( );
											//echo '<pre>';
											//print_r( $listeAction );
											//echo '</pre>';
											$niv1 = 1;
											$niv2 = 1;
											$niv3 = 1;
											if ( isset($listeAction) && !empty($listeAction) ) {
												foreach ( $listeAction as $type => $liste ) :
													$_combo_types.= '<option class="opt_'.$niv1.''.(isset($liste['ENFANTS'])?' parent':'').'" value="'.$type.'" title="'.$liste['NOM'].'">'.$liste['NOM'].'</option>'."\n";
													if ( isset($liste['ENFANTS']) ) {
														foreach ( $liste['ENFANTS'] as $soustype => $sousliste ) :
															$_combo_soustypes.= '<option class="p_'.$niv1.''.(isset($sousliste['ENFANTS'])?' parent':'').'" id="opt_'.$niv2.'" value="'.$type.'-'.$soustype.'" title="'.$sousliste['NOM'].'" style="display:none;">'.$sousliste['NOM'].'</option>'."\n";
															if ( isset($sousliste['ENFANTS']) ) {
																foreach ( $sousliste['ENFANTS'] as $soussoustype => $soussousliste ) :
																	$_combo_sousoustypes.= '<option class="p_'.$niv2.'" value="'.$type.'-'.$soustype.'-'.$soussoustype.'" title="'.$soussousliste['NOM'].'" style="display:none;">'.$soussousliste['NOM'].'</option>'."\n";
																$niv3++;
																endforeach;
															}
														$niv2++;
														endforeach;
													}
													$niv1++;
												endforeach;
												// on ferme les combos
												$_combo_types.= $_combo_end."\n";
												// affichage des combos
												// ---- types
												echo $_combo_types;
												// ---- soustypes
												echo '<div id="select_soustype" style="display:none;" >'."\n";
												echo '<label class="control-label" for="soustype">Sous-type :</label>'."\n";
												echo $_combo_soustypes;
												echo $_combo_end;
												echo '</div>'."\n";
												// ---- sousoustypes
												echo '<div id="select_soussoustype" style="display:none;">'."\n";
												echo '<label class="control-label" for="soussoustype">Sous-sous-type :</label>'."\n";
												echo $_combo_sousoustypes;
												echo $_combo_end;
												echo '</div>'."\n";
											}

Et voici le javascript correspondant :

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
editRow: function(row) {
				var values = row.val();
				console.log(values);
				var detail = noHtml(values.AC_DETAIL).trim();
				var date = values.AC_DATE_PREVU;
				var reg = new RegExp("[ ]+", "g");
				var tab = date.split(reg);
				
				$editor.find('#type').val(values.AC_TYPEACTION);
				$editor.find('#nom_action_id').val(values.AC_NOM_ACTION);
				$editor.find('#ac_codeinterlocuteur_dest').val(values.AC_UTILISATEUR_DEST);
				$editor.find('#dateDeb').val(tab[0]);
				$editor.find('#heureDeb').val(tab[1]);
				date = values.AC_DATEFIN;
				tab = date.split(reg);
				$editor.find('#dateFin').val(tab[0]);
				$editor.find('#heureFin').val(tab[1]);
				$editor.find('#detail_action_id').val(detail);
				$modal.modal('show');
				},

La ligne en rouge, me récupère bien la bonne valeur puisque dans la console, AC_TYPEACTION retourne ce que je souhaite. Il me manque l'initialisation au select...

Merci d'avance à tout intérêt porté à mon post !

Bonne journée à tous !

[-Rpass-]

Pour mettre la valeur par défaut d'un select, il faut ajouter l'attribut "selected" à la valeur correspondante

[JujuPomme]

Bonjour -Rpass-

Merci pour ton intérêt porté à ma question

J'entends bien que c'est quelque chose du genre : http://jsfiddle.net/xkqTR/

Mais dans mon cas, je bloque un peu au niveau de la technique plus que la compréhension...

[-Rpass-]

Ton code a l'air de fonctionner Qu'est-ce qui ne va pas ?

[JujuPomme]

C'est juste un fiddle à part ça hein

Code :

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

$editor.find('#type').val(values.AC_TYPEACTION);

Mon values.AC_TYPEACTION n'est pas set lorsque j'ouvre ma fenêtre modale alors que dans ma console, il me récupère bien la bonne valeur.

Donc quelque chose comme ça :

Code :

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

1
2
var elem = document.getElementById('#type')
elem.value = .value = values.AC_TYPEACTION;

Devrait marcher non?

[SpaceFrog]

Code :

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

$editor.find('#type')

?
c'est un id ???

tu utilises jquery ?

Code :

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

var elem = document.getElementById('#type')

=>

Code :

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

var elem = document.getElementById('type')