ComplexBinding Example Issue

[Chris Persichetti]

Hi,

We are looking at using something like your complex binding example found here:

https://ej2.syncfusion.com/angular/documentation/query-builder/data-binding/#complex-data-binding

But we are having a problem with the dropdowns not slowing all of the values we enter and not scrolling.  Seems to only allow a maximum of 20 items.

For example I updated the code for columns3 to be the following, but the last item that shows up is "Name 18".  Is there something that came be done to fix this preferably showing a scroll bar like now the operator drop down works.

this.columns3 = [

  { field: 'State', label: 'State', columns : [

    { field: 'City', label: 'City', type: 'string'},

    { field: 'Zipcode', label: 'Zip Code', type: 'number'}] },

{ field: 'Region', label: 'Region', type: 'string'},

{ field: 'Name', label: 'Name', type: 'string'},

{ field: 'Name2', label: 'Name2', type: 'string'},

{ field: 'Name3', label: 'Name3', type: 'string'},

 { field: 'Name4', label: 'Name4', type: 'string'},

 { field: 'Name5', label: 'Name5', type: 'string'},

 { field: 'Name6', label: 'Name6', type: 'string'},

 { field: 'Name7', label: 'Name7', type: 'string'},

 { field: 'Name8', label: 'Name8', type: 'string'},

 { field: 'Name9', label: 'Name9', type: 'string'},

 { field: 'Name10', label: 'Name10', type: 'string'},

 { field: 'Name11', label: 'Name11', type: 'string'},

 { field: 'Name12', label: 'Name12', type: 'string'},

 { field: 'Name13', label: 'Name13', type: 'string'},

 { field: 'Name14', label: 'Name14', type: 'string'},

 { field: 'Name15', label: 'Name15', type: 'string'},

 { field: 'Name16', label: 'Name16', type: 'string'},

 { field: 'Name17', label: 'Name17', type: 'string'},

 { field: 'Name18', label: 'Name18', type: 'string'},

 { field: 'Name19', label: 'Name19', type: 'string'},

 { field: 'Name20', label: 'Name20', type: 'string'},

 { field: 'Name21', label: 'Name21', type: 'string'},

 { field: 'Name22', label: 'Name22', type: 'string'},

 { field: 'Name23', label: 'Name23', type: 'string'},

 { field: 'Name24', label: 'Name24', type: 'string'},

 { field: 'Name25', label: 'Name25', type: 'string'}

]

Thanks,

Chris

[Aravinthan Seetharaman]

Hi Chris, 

 

Thanks for contacting Syncfusion support. 

 

We have checked your query. We can resolve this issue in sample level by overriding css style in QueryBuilder. Please refer the below code snippet and sample. 

 

app.component.css 

 

.e-content.e-dropdownbase { 

max-height: 250px !important; 

} 

 

 

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

 

Could you please check the above details, and get back to us, if you need assistance on this. 

 

Regards, 

Aravinthan S 

[Chris Persichetti]

Thank you.  Looks perfect.

[Aravinthan Seetharaman]

Hi Chris, 

 

Thanks for the update. 

 

We are happy to hear that your issue has been resolved. Please feel free to contact us if you need any further assistance on this. 

 

Regards, 

Aravinthan S