Error with DropDownList with ENUM

I'm trying to do a DropDownList with an enum.

I have the enum defined like this :


export enum Permisos {
 Inactive = 'Inactive',
 Active = 'Active',
 Closed = 'Closed',
 Canceled = 'Cancelled',
 Suspended = 'Suspended',
 Archived = 'Archived'
}

, then an entity that has an Enum property:


 export interface Portfolio {
 id: string; // UUid
 name: string; // varchar(255),
 permisos: Permisos ; // ENUM type Permisos
....


Now I create a dropdown instance like this:


 new ex.dropdowns.DropDownList({
 value: args.rowData.permisos,
 popupHeight: '300px',
 floatLabelType: 'Always',
 dataSource: Object.values(Permisos),
 fields: { text: 'Item1', value: 'Item1' },
 placeholder: 'Permisos'
 }, args.form.elements.namedItem('permisos') as HTMLInputElement);



But I get this error:


Image_8304_1722944580734

Thanks


1 Reply

DM Dineshnarasimman Muthu Syncfusion Team August 7, 2024 01:34 PM UTC

Hi Manuel,


Greetings from Syncfusion Support.


We have reviewed your query and understood that you are rendering a dropdownlist component in the edit form and you are facing issue, while providing dataSource the dropdownlist in enum. We tried to replicate the issue by preparing a sample by binding the dropdownlist to the form input element in the actionComplete event of the grid and set the dataSource with enum key values. We cannot able to replicate the issue from our end.


Sample TS: https://stackblitz.com/edit/gsvmgy?file=index.ts


Please provide the following information which will help us to validate further.


  • Provide the video demonstration of the issue, which will help us to understand the replication procedure and identify the issue.


  • Please review the sample which we have attached and replicate the issue by modifying the sample.


  • Ensure us the current Syncfusion package version you are using in your application.


We have also attached the documentation of implementing the enum key values as dataSource to dropdownlist. Please refer this documentation.


Documentation JS: https://ej2.syncfusion.com/javascript/documentation/grid/editing/edit#edit-enum-column


Documentation TS: https://ej2.syncfusion.com/documentation/grid/editing/edit#edit-enum-column


Regards,

Dineshnarasimman M


Loader.
Up arrow icon