We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Editable dropdownlist and dropdowntree in Angular ?

Hi,

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

Any help is appreciated!

Thanks.


3 Replies

SP Sureshkumar P Syncfusion Team November 14, 2022 05:41 AM

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



HI Hieu replied to Sureshkumar P November 15, 2022 07:55 PM

How can I make editable dropdowntree ?



IL Indhumathy Loganathan Syncfusion Team November 16, 2022 11:00 AM

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


Loader.
Live Chat Icon For mobile
Up arrow icon