[Solved] Double dataitems in cell

[Markus]

Hi

 I do have many columns in Kendo (alot of data), hence I am trying to save every pixel of space.

 I am therefore (as done in our "old" grid solution called slickgrid) showing two data items in one cell as per this example (except column "title"):

http://dojo.telerik.com/OwABI

 

1. Now the sorting does not seem to work properly. The filter by word, nor the normal (click on header) sort work anymore. How can I fix this?

2. As mentioned I am trying to save space, because I have many columns is there a way to "hover" the arrow icon or have it use less space? (example on the first column where it uses a lot of space)  

 

Thank you

[Dimo]

Hello Markus,

The demonstrated approach creates more problems than it solves.

First of all, the following field declaration is invalid and triggers Javascript errors:

field: "City<br>Age"

Probably you wanted to set this as a title instead.

The main problem is that data tables normally associate one column to one data field. This data field is used for data operations such as sorting, filtering, etc. Currently one column accommodates multiple data fields. Data operations will work for the field, which is specified in the column configuration. There is no way to specify multiple fields for one column.

Reducing the size of header cell icons will have marginal benefit of the available space, but will reduce the usability of the Grid, as the icons will become harder to click.

You can accommodate more text inside the Grid by reducing the font size, line height and paddings. In addition, consider using horizontal scrolling and frozen columns.

http://docs.telerik.com/kendo-ui/web/grid/appearance#scrolling
 
http://docs.telerik.com/kendo-ui/web/grid/appearance#locked-columns-frozen-columns

.k-grid
{
    font-size: 12px;
}

.k-grid td,
.k-grid .k-grid-header th
{
    line-height: 1.4;
    padding: .3em .4em;
}

.k-grid-header th.k-header > .k-link
{
    margin: 0;
    padding: 0;
}

Regards,
Dimo
Telerik

[Markus]

Hi

 Thank you for your answer.

 I am using the horizontal scroll now. I need to lock (or "freeze") my rightmost column.

 I have found following discussion where kendo states that this is not possible: http://www.telerik.com/forums/freezing-last-column. Has this feature been implemented so far?

 

Many thanks

[Dimo]

Hi Markus,

The linked forum thread is not about the Kendo UI Grid, but about the Silverlight GridView. However, our opinion on the matter is the same - we do not intend to implement frozen columns on both sides, as this will complicate the Grid's HTML output and scripting a lot. Consider moving and freezing the last column on the left, even if it contains some aggregate value.

Regards,
Dimo
Telerik