Editable dropdownlist and dropdowntree in Angular ?

[Unknown]

Hi,

I try to make editable dropdownlist and dropdowntree in Angular, but I can't find any documentation.

Any help is appreciated!

Thanks.

[Sureshkumar P]

Hi Hieu,

You can use the combobox component instead of dropdownlist component to achieve your requirement. To know more about the combobox refer to the below documentation and demo link.

Documentation link: https://ej2.syncfusion.com/angular/documentation/combo-box/getting-started/

Demo link: https://ej2.syncfusion.com/angular/demos/#/bootstrap5/combo-box/default/

Regards,

Sureshkumar P

[Unknown]

How can I make editable dropdowntree ?

[Indhumathy Loganathan]

Hi Hieu,

We don’t have direct support to perform edit actions in the Dropdown Tree component. However, we have achieved the requirement with sample level customization. Check out the below code snippet.

  created() {

    //Enable editing in the Dropdown Tree.

    (this.ddTree as any).treeObj.allowEditing = true;

  }

  select(args) {

    //Keep the popup in open state.

    this.ddTree.showPopup();

  }

  keyPress(args) {

    //Press enter key to update the modified node text.

    if (args.event.key == 'Enter') {

      //clear the selected value.

      this.ddTree.clear();

    }

  }

Sample: https://stackblitz.com/edit/angular-qxnjxn?file=app.component.html,app.component.ts