How to get inline edit - apply and cancel options in the same row

[yavnika]

hi team,

I have a kendo grid with inline edit. When I click on edit, my update and cancel buttons come in 2 rows and not side by side. How can I get them side by side. Currently the column width for edit is 100px. Also my grid has a lot of columns so I need the horizontal scroll. How can I set the edit width to auto and stil have update and cancel buttons side by side?

[Patrick | Technical Support Engineer, Senior]

Hello Yavnika,

From the description of your issue, it sounds like the content is not fitting in the column.  Therefore, the buttons wraps in the column.  I would suggest setting the width wider so the buttons fit.  You can see this approach in our inline editing demo.  You can also find more information about Columns Widths in our documentation.

I hope this clears things.

Regards,
Patrick
Telerik by Progress

 

 

[yavnika]

Hi Patrick,

My requirement is to make width as auto for most columns in the grid and not hard code them. Please let me know how this can be done in kendo grid.

 

Regards,

Yavnika

[Patrick | Technical Support Engineer, Senior]

Hi Yavnika,

Please take a look at this documentation about Column Widths which will help you get a better understanding of how the Grid Columns are setup.

Pertaining to your requirements, the first section under Important notes states:

The Grid renders separate tables for the header and data area when scrolling is enabled. These tables need to have column widths that are synchronized. To ensure this, configure table-layout to fixed. As a result, it is not possible to have a scrollable Grid with automatic table layout—that is, automatic column widths, which depend on the cell content.

I hope this clears things.

Regards,
Patrick
Telerik by Progress