10 examples of 'multiselect dropdown with checkbox in angularjs' in JavaScript

19
wrapWithCheckBox(option, isSelected) {
20
  return (
21
    
22
      {option.value}
23
    
24
  );
25
}

67
populateDropdown() {
68
    const nArgs = this.populateArguments();
69
    const prompts = this.model.conditionalChoices(nArgs);//  scope.select({ args: nArgs });
70
    prompts.then((cvms: ViewModels.ChoiceViewModel[]) => {
71
        // if unchanged return 
72
        if (cvms.length === this.currentOptions.length && _.every(cvms, (c, i) => c.equals(this.currentOptions[i]))) {
73
            return;
74
        }
75
        this.model.choices = cvms;
76
        this.currentOptions = cvms;
77
    }).catch(() => {
78
        // error clear everything 
79
        this.model.selectedChoice = null;
80
        this.currentOptions = [];
81
    });
82
}

146
function dropdown(id, onchange, current_value, item_list, disabled) {
147
    //
148
    // Creates a dropdown for toggling options.
149
    //
150
    // item_list format: [[label, value, disabled], [..], [..]]
151
    //
152
    var items_html = "";
153
    for (i = 0; i < item_list.length; i++) {
154
        var label = item_list[i][0];
155
        var value = item_list[i][1];
156
        var greyed = item_list[i][2];
157
        items_html += ``;
158
    }
159
160
    return `${items_html}`;
161
}

33
selectItem(): void {
34
  if (this.items != null) {
35
    this.selectable.toggleSelectMany(this.items);
36
  } else {
37
    this.selectable.toggleSelectAll();
38
  }
39
}

26
function Dropdown(onChange, listOfValues, getDisplayValue, label) {
27
    if (onChange === void 0) { onChange = function (dropdown) {
28
    }; }
29
    if (getDisplayValue === void 0) { getDisplayValue = Strings_1.l; }
30
    this.onChange = onChange;
31
    this.listOfValues = listOfValues;
32
    this.getDisplayValue = getDisplayValue;
33
    this.label = label;
34
    this.optionsElement = [];
35
    this.buildContent();
36
    this.select(0, false);
37
    this.bindEvents();
38
}

406
private initDropdownValuesAndOptions() {
407
  const config: any = {
408
    displayKey: "description",
409
    height: 'auto',
410
    search: false,
411
    placeholder: 'Select',
412
    searchPlaceholder: 'Search',
413
    limitTo: this.options.length,
414
    customComparator: undefined,
415
    noResultsFound: 'No results found!',
416
    moreText: 'more',
417
    searchOnKey: null,
418
    clearOnSelection: false
419
  };
420
  /* istanbul ignore else */
421
  if (this.config === "undefined" || Object.keys(this.config).length === 0) {
422
    this.config = { ...config };
423
  }
424
  for (const key of Object.keys(config)) {
425
    this.config[key] = this.config[key] ? this.config[key] : config[key];
426
  }
427
  // Adding placeholder in config as default param
428
  this.selectedDisplayText = this.config["placeholder"];
429
  /* istanbul ignore else */
430
  if (this.value !== "" && typeof this.value !== "undefined") {
431
    if (Array.isArray(this.value)) {
432
      this.selectedItems = this.value;
433
    } else {
434
      this.selectedItems[0] = this.value;
435
    }
436
437
    this.selectedItems.forEach((item: any) => {
438
      const ind = this.availableItems.findIndex((aItem: any) => JSON.stringify(item) === JSON.stringify(aItem));
439
      if (ind !== -1) {
440
        this.availableItems.splice(ind, 1);
441
      }
442
    });
443
  }
444
  this.setSelectedDisplayText();
445
}

137
createCheckbox(isChecked) {
138
    this._div.
139
    append(this._check_box).
140
    append(this._label).
141
    append(this._link).
142
    append(this._infospan).
143
    append(this._remove_filter_list_label);
144
145
    this._container.append(this._div);
146
147
    this._bindActions();
148
149
    if (isChecked) {
150
        this._check_box.prop("checked", true);
151
        this._check_box.trigger("change");
152
    }
153
}

20
function setDropdownValues($dropdown, values, selectedValue) {
21
    $dropdown.empty();
22
    var optionsAsString = '';
23
    // add an empty string to the beginning for empty selection
24
    values.unshift('');
25
    $.each(values, function () {
26
        optionsAsString += "";
27
    });
28
    $dropdown.append($(optionsAsString));
29
}

331
private toggleSelectOption(option: Option) {
332
    option.selected ? this.deselectOption(option) : this.selectOption(option);
333
}

36
onSelect(option: Option) {
37
  const {inputValue} = this.state;
38
  this.setState({
39
    inputValue: [...((inputValue || '').split(', ')), option.value].filter(x => x).join(', ').trim()
40
  });
41
}