multiselect checkbox 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;
  }
}