JavaScript UI Libraries & Blazor Components Suite – Smart UI › Forums › Data Grid › commandColumns option
- This topic has 3 replies, 2 voices, and was last updated 3 years, 10 months ago by yavordashew.
-
AuthorPosts
-
January 25, 2021 at 8:38 am #101369dusrkdldlrMember
hello!
I want to use the commandColumns option to do column show/hide in the edit option..
<pre id=”tw-target-text” class=”tw-data-text tw-text-large XcVN5d tw-ta” dir=”ltr” data-placeholder=”번역”><span lang=”en”>However, I wish the rows of commandColumns were not displayed.</span>
Is it possible?January 25, 2021 at 9:37 am #101370yavordashewMemberHi dusrkdldlr,
If you want the whole ‘command’ column to not be displayed you can simply use the ‘visible’ property of the command column.
I have a little code snippet to showcase you how to set this property:
//In your JS filewindow.Smart('#grid', class { get properties() { return { appearance: { showRowHeaderNumber: true }, dataSource: new window.Smart.DataAdapter({ dataSource: window.generateData(1000), dataFields: [ 'id: number', 'firstName: string', 'lastName: string', 'productName: string', 'available: bool', 'quantity: number', 'price: number', 'total: number' ] }), editing: { enabled: true, action: 'none', mode: 'row', commandColumn: { /* With the 'visible' property you can set in order to have the command column visible or not */ visible: true, /* Or you can use the inline property if you don't want to display the command column but when you hover on the row an edit panel will appear */ inline: true } }, columns: [ { label: 'First Name', dataField: 'firstName' }, { label: 'Last Name', dataField: 'lastName' }, { label: 'Product', dataField: 'productName', editor: 'autoComplete' }, { label: 'Available', dataField: 'available', template: 'checkBox', editor: 'checkBox' }, { label: 'Quantity', dataField: 'quantity', editor: 'numberInput' }, { label: 'Unit Price', dataField: 'price', editor: 'numberInput', cellsFormat: 'c2' } ] }; } });
You can have a look at the following demo:
https://www.htmlelements.com/demos/grid/editing-command-column-inline/
Please, do not hesitate to contact us if you have any additional questions.
Best regards,
Yavor Dashev
Smart UI Team
https://www.htmlelements.com/January 26, 2021 at 4:00 am #101373dusrkdldlrMemberthank you for answer! Yavor Dashev
What kind of values are in cellsformat?
What does c2 mean?January 26, 2021 at 8:00 am #101377yavordashewMemberHi dusrkdldlr,
For more information about the ‘cellsFormat’ property I would advice you to take a look at this demo :
https://www.htmlelements.com/demos/grid/column-formatting/
Best regards,
Yavor Dashev
Smart UI Team
https://www.htmlelements.com/ -
AuthorPosts
- You must be logged in to reply to this topic.