https://github.com/revolist/revogrid-column-select
Custom column type for RevoGrid component based on revo-dropdown library.
https://github.com/revolist/revogrid-column-select
autocomplete dropdown revo-grid revogrid select-column webcomponents
Last synced: 3 months ago
JSON representation
Custom column type for RevoGrid component based on revo-dropdown library.
- Host: GitHub
- URL: https://github.com/revolist/revogrid-column-select
- Owner: revolist
- License: mit
- Created: 2020-11-10T16:28:02.000Z (over 4 years ago)
- Default Branch: main
- Last Pushed: 2025-01-15T18:33:48.000Z (6 months ago)
- Last Synced: 2025-04-12T02:23:11.802Z (3 months ago)
- Topics: autocomplete, dropdown, revo-grid, revogrid, select-column, webcomponents
- Language: TypeScript
- Homepage: https://rv-grid.com
- Size: 398 KB
- Stars: 7
- Watchers: 3
- Forks: 11
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
### 🚨 Repository Notice 🚨
This repo is read-only and will be **deprecated** in v5+ in favor of monorepos. Post issues [here](https://github.com/revolist/revogrid). Happy coding! 🖥️💻
---
# Select Column type
Custom column type for [RevoGrid](https://github.com/revolist/revogrid) component based on [revo-dropdown](https://github.com/revolist/revodropdown) library.
## Installation
`npm i @revolist/revogrid-column-select`
## How to use
- Import Select Column type;
- Specify table data;
- Per column specify column type;
- Register your column type;
```js
// do Select class import
import SelectTypePlugin from "@revolist/revogrid-column-select";
const columns = [{
prop: 'name',
labelKey: 'label',
valueKey: 'value',
source: [
{ label: 'According', value: 'a' },
{ label: 'Over', value: 'b' },
{ label: 'Source', value: 's' }
],
columnType: 'select' // column type specified as 'select'
}];
const rows = [{ name: 'New item' }, { name: 'New item 2' }];
// register column type
const columnTypes = { 'select': new SelectTypePlugin() };
// apply data to grid per your framework approach
```
## How to use with static Vanilla JS:
For static sites check this [Sample](https://codesandbox.io/s/revogrid-staticjs-column-jvztc?file=/index.html).