JavaScript Checkbox In DropDown box
In this section, you will learn how to display the checkboxes inside the
dropdown box.
In this section, you will learn how to display the checkboxes inside the
dropdown box.
JavaScript Checkbox In DropDown box
In this section, you will learn how to display the checkboxes inside the
dropdown box. Now to implement this, we have used a div tag inside which we have
created checkboxes. And if you want to get the selected values, select the
checkbox (or checkboxes) and click the button. An alert box will display the
selected values.
Here is the code:
|
<script>
function selectCheckBox()
{
var total=""
for(var
i=0; i < document.form.nums.length; i++){
if(document.form.nums[i].checked)
total +=document.form.nums[i].value + "\n"
}
if(total=="")
alert("select checkboxes")
else
alert("Selected
Values are : \n"+total);
}
</script>
<form name="form">
<div
style="overflow:
auto; width: 100px; height: 75px; border: 1px solid #336699; padding-left:
5px">
<input type="checkbox"
name="nums"
value="1">
1<br>
<input type="checkbox"
name="nums"
value="2">
2<br>
<input type="checkbox"
name="nums"
value="3">
3<br>
<input type="checkbox"
name="nums"
value="4">
4<br>
<input type="checkbox"
name="nums"
value="5">
5<br>
<input type="checkbox"
name="nums"
value="6">
6<br>
</div>
<input type="button"
name="goto"
onClick="selectCheckBox()"value="Check">
<form> |
Output:
After selecting the checkboxes, if you click the button, an alert message
will get displayed:
