|
// Initialize DropDownTree component
var ddTreeObj = new ej.dropdowns.DropDownTree({
...
popupHeight: '200px',
mode: 'Delimiter',
select: onSelect,
change: valueChange,
changeOnBlur: false,
});
ddTreeObj.appendTo('#default');
var selectedValue = [];
// call the change event's function after initialized the component.
function valueChange(args) {
if (args.oldValue !== null && args.isInteracted) {
if (args.e.target.classList.contains('e-check')) {
//Update the value property with node id when checkbox is selected.
this.value = selectedValue;
} else {
if (this.value.length == 0) {
let element = this.element
.closest('.e-show-text')
.getElementsByClassName('e-overflow')[0];
element.remove();
} else {
//Empty the value property when checkbox is unselected.
this.value = [];
}
}
}
}
function onSelect(args) {
if (args.action == 'select') {
//set id of the selected node.
selectedValue = [args.itemData.id];
} else if (args.itemData.selected) {
let proxy = this;
setTimeout(() => {
if (args.itemData.isChecked == 'true') {
selectedValue = [args.itemData.id];
//Update the value property with node id when checkbox is selected.
proxy.value = selectedValue;
} else {
//Empty the value property when checkbox is unselected.
proxy.value = [];
}
}, 5);
}
} | 
