|
Smarty
WARNING: All discussion is moving to https://reddit.com/r/smarty, please go there! This forum will be closing soon. |
|
View previous topic :: View next topic |
Author |
Message |
JoeSatriani Smarty n00b
Joined: 01 Jul 2011 Posts: 4
|
Posted: Thu Aug 18, 2011 6:41 am Post subject: Faire un recherche avec des liste déroulante liées |
|
|
Bonjour,
j'aimerai effectuer une page de recherche avec en tout 3 listes déroulantes, j'aimerai que dans la 1ère, le client choisisse un fabricant, puis ensuite par rapport à ce fabricant les 2 autres liste déroulantes ce complète. J'ai déjà une idée mais je ne sais pas si cela vaut le coup, je pense y faire en javascript ou Ajax.
Quelques petits conseil seront les bienvenues
Cordialement.
Nico |
|
Back to top |
|
Nazo74 Smarty n00b
Joined: 18 Aug 2011 Posts: 4
|
Posted: Sun Aug 28, 2011 9:41 am Post subject: |
|
|
J'ai longtemps cherché ça également. Et j'ai finis par trouver. Le code suivant te donnera ce que tu veux. Tu paramètre ensuite par le css :
Code: | <div class="cadre-recherche-filtree">
<div class="">
</div>
<div class="">
<FORM name="isc">
<div class="">
<select name="example" size="1" onChange="redirect(this.options.selectedIndex)" style="width:170px; font-size:11px;">
<option selected class="177px">Selectionnez d'abord</option>
<option class="177px"></option>
<option class="177px"></option>
</select>
</div>
<div class="presentation-produit6">
<select name="stage2" size="1" onChange="redirect1(this.options.selectedIndex)" style="width:170px; font-size:11px;">
<option value=" " selected class="177px"> </option>
<option value=" " selected class="177px">---Select2--------------</option>
<option value=" " selected class="177px">Selectionnez ensuite</option>
</select>
</div>
<div class="presentation-produit7">
<select name="stage3" size="1" onChange="redirect2(this.options.selectedIndex)" style="width:170px; font-size:11px;">
<option value=" " selected class="177px"> </option>
<option value=" " selected class="177px">---Select3----------------</option>
<option value=" " selected class="177px">Selectionnez enfin</option>
</select>
</div>
</FORM>
<div class="clear"></div>
</div>
<script>
<!--
/*
Triple Combo Script Credit
By Hamid Cheheltani/ JavaScript Kit (http://www.javascriptkit.com)
Visit http://javascriptkit.com for this and over 400+ other scripts
*/
var groups=document.isc.example.options.length
var group=new Array(groups)
for (i=0; i<groups; i++)
group[i]=new Array()
group[0][0]=new Option("Selectionnez ensuite"," ");
group[1][0]=new Option("Selectionnez ensuite"," ");
group[1][1]=new Option("","");
group[1][2]=new Option("","");
group[2][0]=new Option("Selectionnez ensuite"," ");
group[2][1]=new Option("","");
group[2][2]=new Option("","");
group[2][3]=new Option("","");
group[2][4]=new Option("","");
var temp=document.isc.stage2
function redirect(x){
for (m=temp.options.length-1;m>0;m--)
temp.options[m]=null
for (i=0;i<group[x].length;i++){
temp.options[i]=new Option(group[x][i].text,group[x][i].value)
}
temp.options[0].selected=true
redirect1(0)
}
var secondGroups=document.isc.stage2.options.length
var secondGroup=new Array(groups)
for (i=0; i<groups; i++) {
secondGroup[i]=new Array(group[i].length)
for (j=0; j<group[i].length; j++) {
secondGroup[i][j]=new Array() }}
secondGroup[0][0][0]=new Option("Selectionnez enfin"," ");
secondGroup[1][0][0]=new Option("Selectionnez enfin"," ");
secondGroup[1][1][0]=new Option("Selectionnez enfin"," ");
secondGroup[1][1][1]=new Option("","");
secondGroup[1][1][2]=new Option("","");
secondGroup[1][1][3]=new Option("","");
secondGroup[1][2][0]=new Option("Selectionnez enfin"," ");
secondGroup[1][2][1]=new Option("","");
secondGroup[2][0][0]=new Option("Selectionnez enfin"," ");
secondGroup[2][1][0]=new Option("Selectionnez enfin"," ");
secondGroup[2][1][1]=new Option("","");
secondGroup[2][1][2]=new Option("","");
secondGroup[2][1][3]=new Option("","");
secondGroup[2][2][0]=new Option("Selectionnez enfin"," ");
secondGroup[2][2][1]=new Option("","");
secondGroup[2][2][2]=new Option("","");
secondGroup[2][2][3]=new Option("","");
secondGroup[2][3][0]=new Option("Selectionnez enfin"," ");
secondGroup[2][3][1]=new Option("","");
secondGroup[2][3][2]=new Option("","");
secondGroup[2][3][3]=new Option("","");
secondGroup[2][4][0]=new Option("Selectionnez enfin"," ");
secondGroup[2][4][1]=new Option("","");
var temp1=document.isc.stage3
function redirect1(y){
for (m=temp1.options.length-1;m>0;m--)
temp1.options[m]=null
for (i=0;i<secondGroup[document.isc.example.options.selectedIndex][y].length;i++){
temp1.options[i]=new Option(secondGroup[document.isc.example.options.selectedIndex][y][i].text,secondGroup[document.isc.example.options.selectedIndex][y][i].value)
}
temp1.options[0].selected=true
}
function redirect2(z){
window.location=temp1[z].value
}
//-->
</script>
</div>
<div class="clear"></div> |
Un exemple ou je l'ai mis en place :
http://www.plastifieurs.com/plastification-a-chaud.php
Et la je le remets en place, designé autrement sur la boutique que je suis en train de faire actuellement :
http://www.protegez-vos-donnees.fr/boutique (le cadre vert sous le panier)
Bonne continuation |
|
Back to top |
|
|
|
You cannot post new topics in this forum You cannot reply to topics in this forum You cannot edit your posts in this forum You cannot delete your posts in this forum You cannot vote in polls in this forum
|
Powered by phpBB © 2001, 2005 phpBB Group
|