[Solved] No-Wrap in Grid Columns.

[Tarun]

Hi,
I am using Telerik Grid for my application. I want to have a feature in which the columns of a grid should not auto Wrap itself and if the content of Column increases the column width, they should be clipped and shown with ellipses. What is the best way to achieve this?

I was able to achieve this by using Css properties :
So for my column i have added below attributes:

  .HtmlAttributes(new {  @style = "overflow: hidden; white-space: nowrap; text-overflow: ellipses;" });
And added Scrollable attribute to my Grid:
    .Scrollable(s => s.Enabled(true).Height("auto"))

Now I am getting the desired behaviour but with that i am getting a vertical Scroll bar which i Don't want.

Is there a way by which I can hide the vertical scrollbar? It is disabled currently but i want to hide it.



Or is there  a better way to implement this functionality?

Thanks In Advance.

[Dimo]

Hi Tarun,

Please refer to

http://www.telerik.com/community/forums/aspnet-mvc/grid/show-ellipsis-when-cell-content-is-larger-than-the-specified-width.aspx

Greetings,
Dimo
the Telerik team

[Tarun]

Hi,
I already tried this solution but it doesn't solve my problem. If I give only the CSS style which you  have provided the Grid column resizes itself to fit the content in single line even if i have given the column width. But if I give Scrollable attribute with this CSS , it works fine but it give the Scrollbar functionality also which i dont want. Can you tell me a way by which I can hide the vertical scroll bar which is coming?
thanks
tarun

[Dimo]

Hello Tarun,

If you are not using Grid scrolling, then you should also add a fixed table-layout style:

.t-grid  table
{
    table-layout: fixed ;
}

You can do the  same via the TableHtmlAttributes setting of the component.

Best wishes,
Dimo
the Telerik team

[Tarun]

thanks a lot, it worked.