Multiselect dropdown with checkbox in HTML5 code example
Example 1: multiselect dropdown with checkbox typescript
onChange(index_val) {
this.zoneModel = []
if (index_val == 0 && this.zonesList[0].checked == true) {
for (let i = 1; i < this.zonesList.length; i++) {
this.zoneModel.push(this.zonesList[i].houzeyZoneName)
this.zonesList[i].checked = true;
this.zoneFlag = true;
}
} else if (index_val == 0 && this.zonesList[0].checked == false) {
for (let i = 1; i < this.zonesList.length; i++) {
this.zonesList[i].checked = false;
this.zoneFlag = false;//testing
}
} else if (index_val > 0) {
for (let i = 1; i < this.zonesList.length; i++) {
if (this.zonesList[i].checked == true) {
this.zonesList[i].checked = true;
this.zoneFlag = true;
this.zoneModel.push(this.zonesList[i].houzeyZoneName)
if (this.zoneModel.length == this.zonesList.length - 1) {
this.zonesList[0].checked = true;
}
} else {
//this.zoneFlag = false;//testing
this.zonesList[i].checked = false;
if (this.zonesList[0].checked == true) {
this.zonesList[0].checked = false;
}
}
}
}
}
Example 2: multiselect checkbox
var expanded = false;
function showCheckboxes() {
var checkboxes = document.getElementById("checkboxes");
if (!expanded) {
checkboxes.style.display = "block";
expanded = true;
} else {
checkboxes.style.display = "none";
expanded = false;
}
}