i have 3 checkboxes
and a selectbox
if the checkboxes are checked some values need to be populated in the selectbox
but if the selectbox has that value already it should not add them.

suppose checking the checkboxA u shud add options a,b,c,d
checking checkboxB u shud add options b,c,d,e
checking checkboxC u shud add options d,e

if both checkbox A and B are checked the values in the selectbox shud not be repeated
and when u uncheck suppose checkboxB the option e should be removied not b c or d as they r in checkboxA

LVL 25
Who is Participating?
RichieHindleConnect With a Mentor Commented:
Here you go.  This is a self-contained web page that implements your spec:

// The values for each checkbox.
var list = [ ['a', 'b', 'c', 'd'],      // Checkbox A
             ['b', 'c', 'd', 'e'],      // Checkbox B
             ['d', 'e'] ]               // Checkbox C

// Whether each of the three checkboxes is checked.
var checked = [false, false, false]

// Function to empty a selectbox.
function emptyselectbox(selectbox)
   while (selectbox.options && selectbox.options.length > 0)

// Function to add to a selectbox.
function addtoselectbox(selectbox, list)
    var opt = document.createElement("OPTION")
    opt.text = value
    opt.value = value

// Handler for checkboxes being clicked.
function onClick(checkbox, index)
    // Get the selectbox and empty it.
    var selectbox = document.selectform.selectbox
    // Update the array describing which checkboxes are checked.
    checked[index] = checkbox.checked
    // For each checkbox, if it's checked, add its values to the dictionary.
    add = {}
    for (var i=0; i < list.length; i++)
        if (checked[i])
            for (var j = 0; j < list[i].length; j++)
                add[list[i][j]] = true
    // Add the values to the selectbox.
    for (value in add)
        addtoselectbox(selectbox, value)


<form name='selectform' action='something' method='GET'>
<input type='checkbox' name='A' value='Checkbox A' onclick='onClick(this, 0); return true'>
<input type='checkbox' name='B' value='Checkbox A' onclick='onClick(this, 1); return true'>
<input type='checkbox' name='C' value='Checkbox A' onclick='onClick(this, 2); return true'>
<select name='selectbox'></select>


For adding to a select box, all you need to do is:

function addtoselectbox(selectbox, list)
    selectbox.options[selectbox.options.length] = new Option('new text','new value');
Zyloch: Thanks - I didn't know that.  8-)
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.