Transposed Table - dataMap dropdown with virtualization

Transposed Table - dataMap dropdown with virtualization

Posted by: brzozowski.m24 on 3 January 2023, 2:38 am EST

• 

  brzozowski.m24

  • Post Options:
  • Link
    Copy
  • Jump To Answer

  Posted 3 January 2023, 2:38 am EST

  Hello, I’m looking for a solution to provide virtualization for the items in dropdown by using DropdownList cell in my table.

  I have about 10,000 items in my dropdown and it’s quite heavy to load all items at opening dropdown list in my table. Is it possible to provide virtualization to automatically load more items on scroll in this dropdown?
  
  If not, is it possible to provide own dropdown control where I can implement it?
  
  Thank you in advance.

• 

  kartik.dua

  

  • Post Options:
  • Link
    Copy

  Posted 3 January 2023, 6:28 pm EST

  Hi,

  Unfortunately, from your query, we could not clearly understand which C1 controls you are using in your project. Could you please provide the following information, so we can investigate accordingly and assist you better?

  1. The platform for which you are using the C1 controls (for example WinForms, WPF, etc).

  2. Which exact controls you are using in your project (For example. C1FlexGrid, C1ComboBox, etc) and what do you need to implement with them?

  3. The version of the C1 controls you are using.

  Thanks, and Kind Regards,

  Kartik

• 

  brzozowski.m24

  • Post Options:
  • Link
    Copy

  Posted 3 January 2023, 7:23 pm EST

  Hi, thank you for reply.
  
  I have provided a stackblitz for better understand what I would like to achieve.
  
  https://stackblitz.com/edit/angular-cww1yg?file=src%2Fapp%2Fapp.component.html,src%2Fapp%2Fapp.component.ts
  
  In this stackblitz I have transposed grid with Name row. In each Item in Name row, I have dropdowns where we can select specific value (in this case we have only 4 names in dropdown).
  
  In this dropdowns I would like to provide like 10,000 or more names.
  
  The problem is, once I open dropdown with this amount of values, the performance is poor. I would like to provide virtual scroll for these dropdowns, to make sure it’s going to popuplate for example first 100 items, and during the scrolling it’s going to load more.

  Is it possible to provide virtual scrolling for these dropdowns?

• 

  vivek.pannu

  

  • Post Options:
  • Link
    Copy

  Posted 5 January 2023, 10:13 pm EST

  Hi,

  You can use ‘combo-box’ as a custom editor for the column, and virtualize it’s list items by keeping 100 list items initially and then adding more items dynamically by handling the ‘scroll’ event on its dropdown panel.

  You can refer to the following sample for it’s Implementation - https://stackblitz.com/edit/angular-gjwjvu?file=app/app.component.ts

  Regards

• 

  vivek.pannu

  

  • Post Options:
  • Link
    Copy

  Posted 9 January 2023, 6:34 pm EST

  Hi,

  You can also use the ‘virtualizationThreshold’ property of the ‘ComboBox’ (column editor), by setting it to a small number like 100, to enable virtualization.

  Please refer to the following sample for its implementation - https://stackblitz.com/edit/js-gyimto?file=index.js

  Regards