Astuce listes dépendante

De Quickform.

NOUVELLE VERSION DE QUICKFORM :

Dans le champs source et dans son paramétrage Personnalisation du champ ajouter :

onchange="quickform_dependant_lists('nom du champ cible ici', this)"

Et dans la liste ciblée par la première liste : Mettre le nom de la colonne de la table qui correspond à l'id émis par la première liste dans Colonne dépendante dans les options de liste si vous utilisez une table. Sinon en manuel, à la fin de chaque ligne d'item : 1&Première option][25 ou ][ sépare les items de la valeur dépendante


ANCIENNE VERSION DE QUICKFORM :

Bonjour, voici comme créer des listes dépendantes :

Soit deux liste s_lienville et s_lienlieu, ou s_lienlieu dépends de s_lienville

s_lienlieu utilise les éléments suivant pour être générée : Nom de la table #__quickform_2 Champe : id, l_lienville,l_lieu

Etape 1 : Ajouter les scripts dans mon formulaire

Définition de tag personnalisés et scripts avant affichage du formulaire

$this->replace['{s_lienlieu:dependant}'] = 'var s_lienlieu = new Array();
';

//Generation du tableau des options de la liste 2 dont fk = l'id de la table 1
$this->_db->setQuery("SELECT * FROM #__quickform_2");
if( $data = $this->_db->loadObjectList() )
   foreach($data as $value)
      $this->replace['{s_lienlieu:dependant}'] .= "s_lienlieu['".$value->id."']  = {'fk':'".$value->l_lienville."', 'text':'".str_replace("'","",$value->l_lieu)."'};
";
Important : Utiliser ce code
Vous devez remplacer s_lienlieu par le nom de votre champ dans lequel vont s'afficher les résultats. Mais remplacer aussi #__quickform_2 par le nom de la table de votre choix, ainsi que les $value-> correspondant aux colonnes choisies.


Ajouter des fonctions javascript

{s_lienlieu:dependant}

   function dependant_init(target, obj){
     var targetNode = document.getElementById(target);
     if ( targetNode != undefined){
        var table;
        eval('table = '+target);
        targetNode.innerHTML = '';
        var optNode = document.createElement('option');
        optNode.value = -1;
        optNode.appendChild(document.createTextNode(''));
        targetNode.appendChild(optNode);
        for(var i in table){
          if( (obj != undefined && table[i]['fk'] == obj.value) || obj == undefined) {
            optNode = document.createElement('option');
            optNode.value = i;
            optNode.appendChild(document.createTextNode(table[i]['text']));
            targetNode.appendChild(optNode);
          }
        }
     }
   }
Important : Utiliser ce code javascript
Vous devez remplacer s_lienlieu dans le tag {s_lienlieu:dependant} par le nom de votre champ dans lequel vont s'afficher les résultats.

Etape 2 : Paramétrage des champs :

Dans le champ s_lienville ajoutez dans Personnalisation du champ :

onchange="dependant_init('s_lienlieu', this)"
Important : Utiliser ce code
Vous devez placer ce code dans la liste qui sert à filtrer la liste cible (en l'occurence ici la liste cible dépendante est : s_lienlieu.
Outils personnels