Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New Coder
    Join Date
    Dec 2008
    Posts
    18
    Thanks
    4
    Thanked 0 Times in 0 Posts

    Triple Combo - Display new combo boxes, only if needed

    With regards to the Triple Combo script found at the link shown below I modified the script to satisfy my need.

    http://www.javascriptkit.com/script/...plecombo.shtml

    2/3's of the time the script functions as a normal triple combo. The remaining 1/3 of the time, the selections required are satisfied with just 2 inputs.

    In the case where only 2 inputs are required, after the 2nd selection is made, the script acts immediately. (i.e. the user is not forced to make 3 selections when 2 are all that is needed)

    Is it possible to modify the script shown below so only the 1st two combo boxes are initially displayed on the screen, then after the 2nd selection is made if a 3rd selection is required only then is the 3rd combo box displayed?

    If so, how would the script need to be modified so that the 3rd combo box remains hidden from view until needed?




    Original Code:
    <FORM name="isc">
    <table border="0" cellspacing="0" cellpadding="0">
    <tr align="center">
    <td nowrap height="11"> &nbsp;

    <select name="example" size="1" onChange="redirect(this.options.selectedIndex)">
    <option selected>---Select1-------------</option>
    <option>Webmaster Sites</option>
    <option>News Sites</option>
    </select>

    <select name="stage2" size="1" onChange="redirect1(this.options.selectedIndex)">
    <option value=" " selected> </option>
    <option value=" " selected>---Select2--------------</option>
    <option value=" " selected>---Select2--------------</option>
    </select>

    <select name="stage3" size="1" onChange="redirect2(this.options.selectedIndex)">
    <option value=" " selected> </option>
    <option value=" " selected>---Select3----------------</option>
    <option value=" " selected>---Select3----------------</option>
    </select>

    <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("---Select2---"," ");

    group[1][0]=new Option("Now Select This One"," ");
    group[1][1]=new Option("JavaScript","47");
    group[1][2]=new Option("CSS","46");
    group[1][3]=new Option("Ajax","45");

    group[2][0]=new Option("Now Select This One"," ");
    group[2][1]=new Option("General News","115");
    group[2][2]=new Option("Technology News","116");

    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("---Select 3---"," ");
    secondGroup[1][0][0]=new Option("---Select 3---"," ");
    secondGroup[1][1][0]=new Option("Now Select This One"," ");
    secondGroup[1][1][1]=new Option("JavaScript Kit","http://javascriptkit.com");
    secondGroup[1][1][2]=new Option("Dynamic Drive","http://www.dynamicdrive.com");
    secondGroup[1][1][3]=new Option("Java-Scripts.net","http://java-scripts.net");

    secondGroup[1][2][0]=new Option("Now Select This One"," ");
    secondGroup[1][2][1]=new Option("CSS Drive","http://www.cssdrive.com");
    secondGroup[1][2][2]=new Option("CSS Library","http://www.dynamicdrive.com/style/");
    secondGroup[1][2][3]=new Option("CSS Help Forums","http://www.codingforums.com/forumdisplay.php?f=13");

    secondGroup[1][3][0]=new Option("Now Select This One"," ");
    secondGroup[1][3][1]=new Option("Ajaxian","http://www.ajaxian.com");
    secondGroup[1][3][2]=new Option("Ajax Scripts","http://www.javascriptkit.com/script/cutindex11.shtml");

    secondGroup[2][0][0]=new Option("---Select 3---"," ");
    secondGroup[2][1][0]=new Option("Now Select This One"," ");
    secondGroup[2][1][1]=new Option("CNN","http://www.cnn.com");
    secondGroup[2][1][2]=new Option("MSNBC","http://www.msnbc.com");
    secondGroup[2][1][3]=new Option("ABC News","http://www.abcnews.com");

    secondGroup[2][2][0]=new Option("Now Select A Page"," ");
    secondGroup[2][2][1]=new Option("News.com","http://www.news.com");
    secondGroup[2][2][2]=new Option("Wired","http://www.wired.com");

    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>

    </td>
    </tr>
    </table>
    </FORM>

    <p><font face="arial" size="-2">This free script provided by</font><br>
    <font face="arial, helvetica" size="-2"><a href="http://javascriptkit.com">JavaScript
    Kit</a></font></p>

  • #2
    New to the CF scene
    Join Date
    Mar 2013
    Posts
    7
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Request

    Hello

    I am new user can any one help me, after selecting the third option and click on GO button related link will open.

    Request you to please help me out. And please send me the code on my mail
    abmanish71@gmail.com


    Thanks and Regards
    Manish Kumar
    abmanish71@gmail.com




    Quote Originally Posted by dframeli View Post
    With regards to the Triple Combo script found at the link shown below I modified the script to satisfy my need.

    http://www.javascriptkit.com/script/...plecombo.shtml

    2/3's of the time the script functions as a normal triple combo. The remaining 1/3 of the time, the selections required are satisfied with just 2 inputs.

    In the case where only 2 inputs are required, after the 2nd selection is made, the script acts immediately. (i.e. the user is not forced to make 3 selections when 2 are all that is needed)

    Is it possible to modify the script shown below so only the 1st two combo boxes are initially displayed on the screen, then after the 2nd selection is made if a 3rd selection is required only then is the 3rd combo box displayed?

    If so, how would the script need to be modified so that the 3rd combo box remains hidden from view until needed?




    Original Code:
    <FORM name="isc">
    <table border="0" cellspacing="0" cellpadding="0">
    <tr align="center">
    <td nowrap height="11"> &nbsp;

    <select name="example" size="1" onChange="redirect(this.options.selectedIndex)">
    <option selected>---Select1-------------</option>
    <option>Webmaster Sites</option>
    <option>News Sites</option>
    </select>

    <select name="stage2" size="1" onChange="redirect1(this.options.selectedIndex)">
    <option value=" " selected> </option>
    <option value=" " selected>---Select2--------------</option>
    <option value=" " selected>---Select2--------------</option>
    </select>

    <select name="stage3" size="1" onChange="redirect2(this.options.selectedIndex)">
    <option value=" " selected> </option>
    <option value=" " selected>---Select3----------------</option>
    <option value=" " selected>---Select3----------------</option>
    </select>

    <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("---Select2---"," ");

    group[1][0]=new Option("Now Select This One"," ");
    group[1][1]=new Option("JavaScript","47");
    group[1][2]=new Option("CSS","46");
    group[1][3]=new Option("Ajax","45");

    group[2][0]=new Option("Now Select This One"," ");
    group[2][1]=new Option("General News","115");
    group[2][2]=new Option("Technology News","116");

    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("---Select 3---"," ");
    secondGroup[1][0][0]=new Option("---Select 3---"," ");
    secondGroup[1][1][0]=new Option("Now Select This One"," ");
    secondGroup[1][1][1]=new Option("JavaScript Kit","http://javascriptkit.com");
    secondGroup[1][1][2]=new Option("Dynamic Drive","http://www.dynamicdrive.com");
    secondGroup[1][1][3]=new Option("Java-Scripts.net","http://java-scripts.net");

    secondGroup[1][2][0]=new Option("Now Select This One"," ");
    secondGroup[1][2][1]=new Option("CSS Drive","http://www.cssdrive.com");
    secondGroup[1][2][2]=new Option("CSS Library","http://www.dynamicdrive.com/style/");
    secondGroup[1][2][3]=new Option("CSS Help Forums","http://www.codingforums.com/forumdisplay.php?f=13");

    secondGroup[1][3][0]=new Option("Now Select This One"," ");
    secondGroup[1][3][1]=new Option("Ajaxian","http://www.ajaxian.com");
    secondGroup[1][3][2]=new Option("Ajax Scripts","http://www.javascriptkit.com/script/cutindex11.shtml");

    secondGroup[2][0][0]=new Option("---Select 3---"," ");
    secondGroup[2][1][0]=new Option("Now Select This One"," ");
    secondGroup[2][1][1]=new Option("CNN","http://www.cnn.com");
    secondGroup[2][1][2]=new Option("MSNBC","http://www.msnbc.com");
    secondGroup[2][1][3]=new Option("ABC News","http://www.abcnews.com");

    secondGroup[2][2][0]=new Option("Now Select A Page"," ");
    secondGroup[2][2][1]=new Option("News.com","http://www.news.com");
    secondGroup[2][2][2]=new Option("Wired","http://www.wired.com");

    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>

    </td>
    </tr>
    </table>
    </FORM>

    <p><font face="arial" size="-2">This free script provided by</font><br>
    <font face="arial, helvetica" size="-2"><a href="http://javascriptkit.com">JavaScript
    Kit</a></font></p>


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •