AJAX ne voit que le premier élément d'un tableau passé en URL.
Bonjour à toutes et à tous,
un petit problème de JS / AJAX.
Alimenter une liste déroulante suite à un clic sur un bouton.
Un tableau PHP de 3 éléments (pour la liste déroulante) n'a plus qu'un seul élément une fois arrivé dans la routine AJAX.
1) J'ai une routine AJAX qui se déclenche sur click :
=> $('#horodatage_id').click(function() ...
2) J'ai une routine PHP qui extrait des données de la base de données lors de l'exécution du script AJAX par :
=> url: "<?php echo base_url('index.php/ORDRES_TRANSPORTS/ordres_transports_c/XHR_liste_chauffeurs_disponibles');?>/"+date_heure_ordre_transport_DATE,
Pour la date du 31/08/2015 mon script PHP retourne un tableau de 3 enregistrements :
[0] => Array
(
[id_chauffeur] => 21
[prenom] => Nils
[nom] => BBB
[date] => 2015-08-31
[type_date] => astreinte
)
[1] => Array
(
[id_chauffeur] => 1
[prenom] => Alain-Bernard
[nom] => Delarose
[date] => 2015-08-31
[type_date] => astreinte
)
[2] => Array
(
[id_chauffeur] => 24
[prenom] => Albert
[nom] => Einstein
[date] => 2015-08-31
[type_date] => congés payés
)
Ce tableau, une fois arrivé dans la routine AJAX, ne comprend plus qu'un seul enregistrement :
success: function(liste_chauffeurs_disponibles)
{
console.log(liste_chauffeurs_disponibles.length); => 1
Pourquoi je n'ai plus qu'un seul enregistrement sur les 3 ?
Code partiel PHP :
Code:
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
| $extraction = array();
if ( $this->db->affected_rows() > 0 )
{
$this->db->order_by('nom', 'asc');
$extraction = $this->db->get()->result_array();
}
//echo '@'.$this->db->affected_rows().'@';
//echo $this->db->last_query() . '<br />';
//echo '<pre>'; echo '$extraction'; print_r($extraction); echo '</pre>'; //exit();
if ( !empty($extraction) )
{
return $extraction;
/*
// Création des lignes de la liste déroulante HAUT.
foreach ( $extraction as $dates_valeur)
{
$LD_chauffeurs_disponibles[$dates_valeur['id_chauffeur']]
= $dates_valeur['id_chauffeur'] . ' : ' . $dates_valeur['prenom'] . ' ' . $dates_valeur['nom'] . ' ' .html_entity_decode('➜') . ' ' . $dates_valeur['type_date'];
}
*/
}
else
{
$LD_chauffeurs_disponibles = ['inconnu' => 'Pas de chauffeurs'];
return $LD_chauffeurs_disponibles;
} |
Code complet AJAX :
Code:
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
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
| // La fonction de traitement est disponible une fois que le document est prêt.
$(document).ready(function()
{
console.log('prêt');
$('#horodatage_id').click(function()
// Si l'élément identifié par id="date_heure_ordre_transport_DATE" change, on construit une fonction qui exécute le code ...
{
console.log('date_heure_ordre_transport_DATE a changé');
// D'abord, on enlève le contenu actuel de la liste identifiée par id="id_chauffeur" (codé en dur).
$("#id_chauffeur > option").remove();
// On récupère dans une variable la date OT choisie.
var date_heure_ordre_transport_DATE = $('#date_heure_ordre_transport_DATE').val();
console.log('date_heure_ordre_transport_DATE : ');
console.log(date_heure_ordre_transport_DATE);
$.ajax(
{
type: "POST",
// On appelle notre controleur suivi de la méthode XHR_liste_chauffeurs_disponibles, selon la date OT choisie.
//url: "http://localhost/CI/CI220_FMT1/index.php/ORDRES_TRANSPORTS/ordres_transports_c/XHR_recuperer_courses/"+id_etablissement_commanditaire,
// La ligne écrite au dessus à le chemin en dur, alors que la ligne en dessous à la variable qui contient le chemin.
url: "<?php echo base_url('index.php/ORDRES_TRANSPORTS/ordres_transports_c/XHR_liste_chauffeurs_disponibles');?>/"+date_heure_ordre_transport_DATE,
// ici les éléments sont déjà dans l'ordre,
// car on n'a plus le premier index pour l'ordre, mais que l'index pour les chauffeurs, qui ne sont pas dans l'ordre alphabétique.
// Il faut, ici, récupérer le tableau avec l'index, 0, 1, 2, ...
// Et reconstruire ici un tableau sans cet index.
// On récupère la réponse dans un tableau liste_chauffeurs_disponibles au format json.
success: function(liste_chauffeurs_disponibles)
{
console.log(liste_chauffeurs_disponibles.length);
console.log(liste_chauffeurs_disponibles);
for (i = 0; i < liste_chauffeurs_disponibles.length; i ++)
{
console.log(liste_chauffeurs_disponibles[i]);
// On crée les options du select.
var opt = $('<option />');
opt.val(liste_chauffeurs_disponibles[i].id_chauffeur);
opt.text( liste_chauffeurs_disponibles[i].prenom +' '+
liste_chauffeurs_disponibles[i].nom +' '+
liste_chauffeurs_disponibles[i].type_date);
// On positionne ces nouvelles options à la suite des options existantes (qui ont été supprimées au début !)
// pour le select identifié par id="id_chauffeur"
$('#id_chauffeur').append(opt);
}
/*
// Une boucle foreach permet de récupérer les id et noms de chaque chauffeur.
$.each(liste_chauffeurs_disponibles,function(id_chauffeur,texte)
{
// On crée les options du select.
var opt = $('<option />');
opt.val(id_chauffeur);
opt.text(texte);
console.log($(opt));
// On positionne ces nouvelles options à la suite des options existantes (qui ont été supprimées au début !)
// pour le select identifié par id="id_chauffeur"
$('#id_chauffeur').append(opt);
}
);
*/
}
});
});
});
// ]]> |
