search

nhn / tui.grid

🍞🔡 The Powerful Component to Display and Edit Data. Experience the Ultimate Data Transformer!
http://ui.toast.com/tui-grid/
MIT License
2.42k stars 389 forks source link

Implementing Custom Dropdown Renderer #1257

Open on2air opened 3 years ago

on2air commented 3 years ago

I'm trying to use this select dropdown as the custom renderer for a column: https://jquense.github.io/react-widgets/api/DropdownList/

The reason is that the dropdown is a larger dataset that requires search functionality that the default select doesn't appear to support.

It loads, but when clicked it doesn't display the dropdown because its trying to render outside the cell area. How does the default select widget render outside the cell?

Anyone try to use a custom widget like this? or able to get this one working?

js87zz commented 3 years ago

@on2air Can you give your sample code in code sandbox? I want to know more detail.

on2air commented 3 years ago

i should have done that first :) https://codesandbox.io/s/brave-kirch-p0dbh?file=/src/App.js

Looks like it does expand outside the cell area, so likely some of my own css causing the issue I'm seeing.

js87zz commented 3 years ago

@on2air Sorry for late replying. I checked your issue, I think the dropdown list size can be controlled with css(or dropdown list option(?)) in your code. However, you have to implement key binding event and position control like our default select editor to make it work well.

You need search functionality in the default select editor? If so, we'll go over this feature.

on2air commented 3 years ago

@js87zz - yes, search functionality would be great to have and to be able to configure how many options show by default in the dropdown list.

stale[bot] commented 3 years ago

This issue has been automatically marked as inactive because there hasn’t been much going on it lately. It is going to be closed after 7 days. Thanks!