Knowledge Walls
John Peter
Pune, Maharashtra, India
How to create multiselect combobox with checkbox in Javascript and HTML with Example
23151 Views
HTML
1
2
3
4
5
6
7
8
9
<div class="multiple_select_checkbox">
   <div id="multiple_select_checkbox_choice"><input type="checkbox" name="slt_username" value="1001" />Siva</div>
   <div id="multiple_select_checkbox_choice"><input type="checkbox" name="slt_username" value="1002" />Raja</div>
   <div id="multiple_select_checkbox_choice"><input type="checkbox" name="slt_username" value="1003" />Kumar</div>
   <div id="multiple_select_checkbox_choice"><input type="checkbox" name="slt_username" value="1004" />Vijay</div>
</div>
 
<br />
<button onclick="javascript:validate();">Validate</button>
CSS
1
2
3
4
5
6
7
div.multiple_select_checkbox {
    width: 150px;
    height: 60px;
    overflow-x: hidden;
    overflow-y: auto;
    border: 1px solid #CCCCCC;
}
JAVASCRIPT
1
2
3
4
5
function validate(){
    for (var i=0;i<document.getElementsByName("slt_username").length;i++){
       alert(document.getElementsByName("slt_username")[i].checked+"-"+document.getElementsByName("slt_username")[i].value);
    }
}
OUTPUT 
DEMO 
Next Topics
Next lessons of current book.
Best Lessons of "Good Javascript Examples"
Top lessons which are viewed more times.
  Copyright © 2014 Knowledge walls, All rights reserved
KnowledgeWalls
keep your tutorials and learnings with KnowledgeWalls. Don't lose your learnings hereafter. Save and revise it whenever required.
Click here for more details