Dynamic Dropdownbox with multiple select

Discussion in 'JavaScript' started by linksprocket, Feb 3, 2010.

  1. #1
    Hope some one can assist me

    Below is my code which works fine.

    I need to be able to select more than one of the options at the same time. The code at the moment will only select one option rather than all my options.

    Any advice would be great.

    <HTML>
    <HEAD>
    <title>MDT Role and Application Selection Application - Gen-i</title>


    <!-- Example of the multiple selections

    Sub RunScript
    For i = 0 to (Dropdown1.Options.Length - 1)
    If (Dropdown1.Options(i).Selected) Then
    strComputer = strComputer & Dropdown1.Options(i).Value & vbcrlf
    End If
    Next
    Msgbox strComputer
    End Sub
    -->



    <script>
    function setOptions(chosen) {
    var selbox = document.myform.opttwo;

    selbox.options.length = 0;
    if (chosen == " ") {
    selbox.options[selbox.options.length] = new Option('Please select one of the options above first',' ');
    }



    if (chosen == "1") {
    selbox.options[selbox.options.length] = new
    Option('Microsoft Project','Microsoft Project selected');
    selbox.options[selbox.options.length] = new
    Option('Microsoft Visio','Microsoft Visio selected');
    selbox.options[selbox.options.length] = new
    Option('Cognos Application','Cognos Application selected');
    }




    if (chosen == "2") {
    selbox.options[selbox.options.length] = new
    Option('Microsoft Project','Microsoft Project selected');
    selbox.options[selbox.options.length] = new
    Option('Microsoft Visio','Microsoft Visio selected');
    selbox.options[selbox.options.length] = new
    Option('Cognos Application','Cognos Application selected');
    selbox.options[selbox.options.length] = new
    Option('Oracle Discoverer','Oracle Discoverer selected');
    selbox.options[selbox.options.length] = new
    Option('At Risk 5.55','At Risk 5.55 selected');
    }
    if (chosen == "3") {
    selbox.options[selbox.options.length] = new
    Option('Microsoft Project','Microsoft Project selected');
    selbox.options[selbox.options.length] = new
    Option('Microsoft Visio','Microsoft Visio selected');
    selbox.options[selbox.options.length] = new
    Option('Vulcan 8','Vulcan 8 selected');
    selbox.options[selbox.options.length] = new
    Option('Autocad Lite 2010 Lite','Autocad Lite 2010 Lite selected');
    selbox.options[selbox.options.length] = new
    Option('Autocad Lite 2010 Full','Autocad Lite 2010 Full selected');
    selbox.options[selbox.options.length] = new
    Option('Aquire','Aquire selected');
    selbox.options[selbox.options.length] = new
    Option('WellCad','WellCad selected');
    selbox.options[selbox.options.length] = new
    Option('ArcGis','ArcGis selected');
    selbox.options[selbox.options.length] = new
    Option('QuickMap','QuickMap selected');
    }
    }
    </script>

    <HTA:APPLICATION
    border="thin"
    borderStyle="normal"
    caption="yes"
    maximizeButton="yes"
    minimizeButton="yes"
    showInTaskbar="no"
    innerBorder="yes"
    navigable="yes"
    scroll="auto"
    scrollFlat="yes" />

    <script LANGUAGE="VBScript">
    Sub Window_onLoad
    window.resizeTo 600,720
    End Sub
    </script>

    </head>

    <body style="{background-image:url('bg2.jpg'); background-repeat:no-repeat;}">
    <CENTER>
    <img src="logo.gif" />
    <h2 style="font-size: 12pt; font-family: Arial; color: #000">Please select the required role - Gen-i</h2>
    <div style="font-size: 10pt; font-family: Arial; color: #298FFF">
    <form name="myform"><div align="center">
    <b>Select a Role:</b> <br /> <select name="optone" size="1"
    onchange="setOptions(document.myform.optone.options
    [document.myform.optone.selectedIndex].value);">
    <option value=" " selected="selected"> </option>
    <option value="1">General</option>
    <option value="2">Technical</option>
    <option value="3">Finance</option>
    </select>
    <br /><br /><b>Select Applications:</b> <br />
    <select name="opttwo" size="10" multiple>
    <option value=" " selected="selected">Please select one of the options above first</option>
    </select>
    <p></p>
    <input type="button" name="go" value="Value Selected"
    onclick="alert(document.myform.opttwo.options
    [document.myform.opttwo.selectedIndex].value);">
    </div></form>
    </body>
    </html>
     
    linksprocket, Feb 3, 2010 IP
  2. s_ruben

    s_ruben Active Member

    Messages:
    735
    Likes Received:
    26
    Best Answers:
    1
    Trophy Points:
    78
    #2
    Add attribute multiple="multiple" to that selects.
     
    s_ruben, Feb 4, 2010 IP