Liste liées

**samspitz** · 11/07/2010, 18h57

Bonjour à tous,

je souhaiterais charger un Zend_Form_Element_Select selon un autre Zend_Form_Element_Select, existe-t-ils une fonction zend_form pour ceci ?
mon zend_form select:

Code :

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

1
2
3
4
5
6
7
8
9
 
$modele = new Zend_Form_Element_Select('idModele');
        $modele->setLabel('listes des modeles ')
                ->setAttrib('id','select#marque')
               ->addMultiOptions($modeleTab);
          // les resultats du deuxième zend form doit dependre du premier      
    $finition = new Zend_Form_Element_Select('idFinition');
        $finition->setLabel('listes des finition')
                 ->addMultiOptions($finitionTab);

merci d'avance

**manuscle** · 12/07/2010, 08h48

Salut,

Tu peux le faire en javascript (Voit du coté de Dojo et Json).

**freeseb74** · 12/07/2010, 10h04

Bonjour,

Personnellement, pour ce cas je passe par une requête AJAX (JQuery) coté client à chaque sélection de la première liste qui me renvoie une réponse Json depuis l'action du controller, avec la réponse je recrée la seconde liste.
Si cela t'intéresse, je peux te fournir le code et les explications qui vont avec.

**samspitz** · 12/07/2010, 12h34

Merci beaucoup de la réponse. Oui je veux bien voir le code avec les commentaire s'il te plait.

**freeseb74** · 12/07/2010, 20h16

Bonjour pour être bien clair, je vais définir le contexte.
Les données (des listes déroulantes) sont issues de la DB, nous avons 3 tables :
- 'continent' (id_continent, non_continent)
- 'pays' (id_pays, nom_pays, continent_id (FK) )
- 'ville' (id_ville, nom_ville, pays_id (FK) )

Ses 3 listes déroulantes vont se renseigner avec cohérence d'elle même à chaque sélection de l'une d'elle.

Voici les étapes :
- Accès au table (Zend_Db_Table_Abstract)
- Création d'un formulaire (Zend_Form)
- Conception d'un Zend_Controller spécifique à AJAX
- Le code Javascript coté client

Mon modèle de la table 'continent' >> TContinents.php

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
class TContinents extends Zend_Db_Table_Abstract  {
 
       /**
	 * Nom de la table
	 */
	protected $_name = 'continent';
 
	/**
	 * Nom de la clé primaire
	 */
	protected $_primary = 'id_continent';
 
 
	/**
	 * 
	 */
	public function selectData () {
 
		$select = $this->select();
		return $this->fetchAll($select);
 
	}//Eof:: selectData
 
}//Eof:: class

Mon modèle de la table 'pays' >> TPays.php

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
class TPays extends Zend_Db_Table_Abstract  {
 
       /**
	 * Nom de la table
	 */
	protected $_name = 'pays';
 
	/**
	 * Nom de la clé primaire
	 */
	protected $_primary = 'id_pays';
 
 
	/**
	 * 
	 */
	public function selectData () {
 
		$select = $this->select();
		return $this->fetchAll($select);
 
	}//Eof:: selectData
 
}//Eof:: class

Mon modèle de la table 'ville' >> TVilles.php

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
55
56
57
58
59
60
class TVilles extends Zend_Db_Table_Abstract  {
 
       /**
	 * Nom de la table
	 */
	protected $_name = 'ville';
 
	/**
	 * Nom de la clé primaire
	 */
	protected $_primary = 'id_ville';
 
	/**
	 * 
	 */
	public function selectData () {
 
		$select = $this->select();
		return $this->fetchAll($select);
 
	}//Eof:: selectData
 
	/**
	 *
	 */
	public function selectRecherche ($critere) {
 
		$sql = "SELECT   `C`.id_continent
					   , `C`.non_contienent
					   , `P`.id_pays
					   , `P`.nom_pays
					   , `V`.id_ville
					   , `V`.nom_ville
				FROM ville AS `V`
				LEFT JOIN pays AS `P`ON `V`.pays_id = `P`.id_pays
				LEFT JOIN continent AS `C`ON `P`.continent_id = `C`.id_continent
				WHERE 1
				";
 
		// Continent
		if (!$critere['id_continent'] == "") {
			$sql .= " AND `C`.id_continent = ".$critere['id_continent'];
		}
 
		// Pays
		if (!$critere['id_pays'] == "") {
			$sql .= " AND `P`.id_pays = ".$critere['id_pays'];
		}
 
		// Ville
		if (!$critere['id_ville'] == "") {
			$sql .= " AND `C`.id_ville = ".$critere['id_ville'];
		}
 
 
		return $this->getAdapter('db')->fetchAll($sql);        
 
	}//Eof:: selectRecherche
 
}//Eof:: class

Pour le modèle de table 'ville', la fonction selectRecherche ($critere) permet d'extraire un résultat selon les choix effectués d'un continent, d'un pays ou d'une ville.

Maintenant la création du formulaire sur le modèle Zend_Form
>> FRecherche.php

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
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
96
97
98
99
100
101
102
103
104
105
106
107
108
class FRecherche extends Zend_Form {
 
	public function __construct($options = null) {
 
        parent::__construct($options);
 
              /* Le Formulaire */
              $this->addAttribs( array( 'id' => 'recherche')); 
 
               /* Bouton Reset */
              $reset = new Zend_Form_Element_Button('reset');
              $reset ->setLabel('reset');        
 
 
		// Liste des continents
		$id_continent = new Zend_Form_Element_Select('id_contient');
		$id_continent->setLabel ('Continent')
					->addMultiOptions($this->listContinent())	
					;
 
		// Liste des pays
		$id_pays = new Zend_Form_Element_Select('id_pays');
		$id_pays->setLabel ('Pays')
				->addMultiOptions($this->listPays())	
				;
 
		// Liste des villes
		$id_ville = new Zend_Form_Element_Select('id_ville');
		$id_ville->setLabel ('Ville')
				->addMultiOptions($this->listVille())	
				;
 
 
     	       /* Element bouton de validation */
		$submit = new Zend_Form_Element_Submit('submit');
                $submit ->setAttrib('id', 'submitbutton')
                           ->setLabel('Chercher')
                             ;
 
 
     	$this->addElements(array(   $reset
     					  , $id_continent
     					  , $id_pays
     					  , $id_ville
                               	          , $submit
                                  ));
 
    } //Eof:: __construct
 
 
 
    /**
     * Liste des continents
     */
    private function listContinent () {
 
        $TContinents = new TContinents();
        $Continents = $TContinents->selectData();
 
        $listContinent = array();
        $listContinent[""] = "-- Choisissez --"; 
        foreach ($Continents as $Continent) {
               $listContinent[$Continent->id_continent] = $Continent->nom_continent;            
        }
 
        return $listContinent;
 
    }//Eof:: listContinent
 
 
    /**
     * Liste des Pays
     */
    private function listPays () {
 
        $TPays = new TPays();
        $Pays = $TPays->selectData();
 
        $listPays = array();
        $listPays[""] = "-- Choisissez --"; 
        foreach ($Pays as $pays) {
               $listPays[$pays->id_pays] = $pays->nom_pays;            
        }
 
        return $listPays;
 
    }//Eof:: listPays
 
 
   /**
     * Liste des Villes
     */
    private function listVille () {
 
        $TVilles = new TVilles();
        $Villes = $TVilles->selectData();
 
        $listVille = array();
        $listVille[""] = "-- Choisissez --"; 
        foreach ($Villes as $Ville) {
               $listVille[$Ville->id_ville] = $Ville->nom_ville;            
        }
 
        return $listVille;
 
    }//Eof:: listVille
 
}//Eof:: Class

Nous avons besoin d'un controller spécifique pour les requête AJAX

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
 
class AjaxController extends Zend_Controller_Action 
{
 
	/**
	 * Initialiseur de ma classe
	 *
	 */
	public function init () {
 
        //si requete ajax on désactive les layouts et la vue pour une réponse JSON
        if($this->_request->isXmlHttpRequest()){
	       $this->_helper->layout->disableLayout();
               $this->_helper->viewRenderer->setNoRender(true);
               $this->_helper->viewRenderer->setNeverRender(true);
        }
	}//Eof:: init
 
	/**
	 * 
	 * @return un tableau d'élément au format JSON
	 */
    public function remplirAction() 
    {
        	// Récupération des paramètres passés dans la requête
            $params = $this->_request->getParams();
 
            // Appel de mon modèle de table
            $TVilles = new TVilles();
            // Extraction selon les critère de recherche des différents paramètres
            $Rows = $TVilles->selectRecherche($params);
 
             // Transforme mes données en tableau PHP 
            $list = array();
            foreach ($Rows as $row) {
            	$list ['continent'][$row->id_continent] = $row->nom_continent;
                $list ['pays'][$row->id_pays]  = $row->nom_pays;
                $list ['ville'][$row->id_ville] = $row->nom_ville;
            }
 
            // Je renvoie ce tableau à ma vue au format JSON
            $this->_helper->json($list
                                  , array(
                                    		'enableJsonExprFinder' => true
                                          ));
 
    }//Eof:: remplirAction
 
}//Eof:: Class

L'action 'remplir' va être appelé du coté client en javascript et renvoie un résultat au format JSON

Maintenant la partie la plus délicate le code javascript, mais j'utilise JQUERY qui facile grandement la tâche

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
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
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
/**
 
	fichier "public/js/jquery/custom/custom.js"
	réalise des actions Javascript en s'appuyant sur le
	Framework javascript JQUERY
 
*/
 
//Remplir les select du formulaire en fonction de la réponse AJAX
function remplirSelect (dataAjax) {
 
    // Envoi requête AJAX   	
    $.ajax({
         type: "POST"
       , url: "../ajax/remplir" // controller : ajax , action : remplir
       , data : dataAjax
       , dataType: "json"
       , success: function(reponse){
 
	   // Sur Succès de la réponse AJAX
 
	   // Duplique ma réponse	
   	   var optionData = reponse;
 
	    // Suppression des éléments de mes listes déroulantes
	   $("#id_continent > option").remove();
	   $("#id_pays > option").remove();
	   $("#id_ville> option").remove();
 
	   // Ajoute les options pour chaque liste déroulante en fonction de la réponse
	   // Mes Continents    
	   i = 0;           
	   for (key in reponse.continent) {	
		$("#id_continent").append(  '<option label="' 
                    					  + optionData['continent'][key]
                                 			  + '"'
                                 			  + 'value="'
							  + key
							  + '">'
							  + optionData['continent'][key]
							  + '</option>');
		i++;
		if (i == 2) { 
				$("#id_continent:first").prepend( '<option label="Choisissez" value="" >-- Choississez --</option>');
				$("#id_continent option:first").attr ('selected', 'selected');
				}
		} //Eof:: for 'continent'
 
	 	// Mes Pays    
	 	i = 0;           
		for (key in reponse.pays) {	
			$("#id_pays").append(  '<option label="' 
                    					  + optionData['pays'][key]
                                 			  + '"'
                                 			  + 'value="'
							  + key
							  + '">'
							  + optionData['pays'][key]
							  + '</option>');
			i++;
			if (i == 2) { 
					$("#id_pays:first").prepend( '<option label="Choisissez" value="" >-- Choississez --</option>');
					$("#id_pays option:first").attr ('selected', 'selected');
					}
		} //Eof:: for 'pays'
 
	 	// Mes Villes    
	 	i = 0;           
		for (key in reponse.ville) {	
 		  $("#id_ville").append(  '<option label="' 
                    					  + optionData['ville'][key]
                                 			  + '"'
                                 			  + 'value="'
							  + key
							  + '">'
							  + optionData['ville'][key]
							  + '</option>');
		    i++;
		    if (i == 2) { 
				$("#id_ville:first").prepend( '<option abel="Choisissez" value="" >-- Choississez --</option>');
				$("#id_ville option:first").attr ('selected', 'selected');
					}
		} //Eof:: for 'ville'
 
 
    	} //Eof:: success
    });  //Eof:: ajax 
 
} //Eof:: fucntion remplirSelect
 
 
 
//Sur fin du chargement du document
$(document).ready( function() {
 
	// Sur changement de l'un des 'select'
	$("select").change(function(){
 
		// Je recupère la valeur des sélections en cours
	 	Vid_continent = $("select#id_continent").val();
	 	Vid_pays = $("select#id_pays").val();
	 	Vid_ville = $("select#id_ville").val();
 
	 	// Données à passer à la requête AJAX
	 	var dataAjax = {  id_continent:[Vid_continent]
	 	                , id_pays:[Vid_pays]
	 	                , id_ville:[Vid_ville]
 	         	    };
 
		// Modification des 'select'
		remplirSelect (dataAjax);
 
	}); //Eof:: sur changement de l'un des 'select'
 
 
	// Sur click bouton reset
	$("#reset").click (function() {
 
		// Aucun choix
	 	Vid_continent = "";
	 	Vid_pays = "";
	 	Vid_ville = "";
 
	 	// Données à passer à la requête AJAX
	 	var dataAjax = {  id_continent:[Vid_continent]
	 	                , id_pays:[Vid_pays]
	 	                , id_ville:[Vid_ville]
 	         	    };
 
		// Modification des 'select'
		remplirSelect (dataAjax);
 
	}); //Eof:: sur click btn 'reset'
 
 
}); //Eof:: ready

A Chaque changement de sélection sur l'une des listes déroulantes, je récupère la valeur de l'option sélection, que j'envoie à mon controller 'Ajax' action 'remplir', qui me retourne les nouvelles listes qui me permet de recréer par la modification du DOM

il faut bien entendu appeler le modèle formulaire depuis ,par exemple, le controller 'index', action 'index' et le rendre à sa vue par défaut (echo $this->form)

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
 
class IndexController extends Zend_Controller_Action 
{
	/**
	 * Action par défaut
	 */
    public function indexAction() 
    {
 
    	// Appel de mon formulaire
    	$Form = new FRecherche();
 
    	// Assignation de mes éléments à ma vue
    	$this->view->form = $Form;
    }
 
}//Eof:: class

Après utilise Firebug et sa console pour voir les réponses AJAX, si soucis

J'espère que cela te conviendra.

**shadypierre** · 16/07/2010, 11h27

Superbe réponse

**cyrux** · 03/08/2010, 15h58

Effectivement, superbe réponse,

Existe il un moyen de faire ceci mais avec en premier choix un textbox (qui s'auto rempli via Jquery (qui va chercher les informations dans la base) et qui par la suite rempli la list box en fonction de l'information selectionnée dans la textbox ??

Je récapitule :
1) l'utilisateur saisi une partie du nom d'un fournisseur
=> jquery lui propose des résultats en fonction de ce qu'il a tapé et de ce qui existe dans la base

2) une fois le fournisseur choisi, charger la liste des articles qu'il propose dans la liste déroulante.

merci d'avance !

**freeseb74** · 03/08/2010, 16h32

Cyrux,

Il faut utiliser l'autocomplete dans le permier textbox
puis AJAX pour récupérer tes informations
et JQUERY pour alimenter le 2ème texte box

Donc tous en javascript coupler à Zend pour les requêtes retourné au format JSON.

SVP ouvrir une autre discussion sur le sujet.

**Jimmy72_** · 06/04/2011, 22h21

Bonjour, j'essaye ce que freeseb74 a mis comme code, seulement l'AJAX ne se fait pas il n'y a aucune sélection sur les listes.

Il y a t'il une déclaration spéciale a faire pour le javascript ou autre?

Merci de bien vouloir éclairer ma lanterne.

Liste liées

Zend_Form PHP

Discussions similaires

Partager

Partager