Don't allow the to wrap the data in radgrid cell

[Hrushikesh Mokashi]

Hi All,

I am using radgrid and VS2008.

I want to show the data in grid in one line row.
Currently it expand the cell and row height according to the data.
I want to show the data in in line row . if data is greater then it will show the '...'.
How can it achieve?

I have tried the implement css which run in VS2005 for gridview.
 td { word-wrap: break-word; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; }

in VS2008 this css doesn't work.

Or there is way to set the grid css?

Thanks.

[Daniel]

Hello Hrushikesh,

I recommend you examine the appropriate article in our documentation:
No wrap for grid cell content

Also you can set overflow: hidden to prevent the text wrapping.

<style type="text/css">
    .MasterTable_SkinName td
    {
      overflow: hidden;
    }
    .GridHeader_SkinName
    {
      overflow: hidden;
    }
</style>

Best regards,
Daniel
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.

[Shinu]

Hi Hrushikesh,

One suggestion is applying DataFormatString in order to prevent text wrapping.
ASPX:

<telerik:GridBoundColumn DataField="ShipName" HeaderText="ShipName" UniqueName="ShipName" DataFormatString="<nobr>{0}</nobr>">
</telerik:GridBoundColumn>

Another option is by setting the ItemStyle of the column. But for the wrap to take place properly make sure that the cell text contains white space in between. Also set the TableLayout to Fixed so that wrapping will occur in accordance with column resizing.
ASPX:

<MasterTableView TableLayout="Fixed" datasourceid="SqlDataSource1" >
    <Columns>
         . . .
        <telerik:GridBoundColumn DataField="ShipName" HeaderText="ShipName" SortExpression="ShipName" UniqueName="ShipName">
             <ItemStyle Wrap="false" Width="50px"  />
</telerik:GridBoundColumn>
    </Columns>
</MasterTableView>

Refer the following documentation for more information about preventing wraping for grid cell.
No wrap for grid cell content

Thanks,
Shinu.

[DoomerDGR8]

Hello Daniel,

You purposed solution is the only way for me to go as I'm extensively applying DataFormats in all the RadGrids I'm using site-wide (over 45 now). Here is the code from a CSS file called SiteStyles.Grid.scc:

.MasterTable_Office2007 td {
  overflow: hidden;
  /* white-space: nowrap; */
}

.GridHeader_Office2007 {
  overflow: hidden;
}

Office2007 is the site's style. Kindly advise why wrapping is still in effect. Thank you.

[TurtleBoy]

The answer I found was to add the max-width property to the css:

I have used:

    max-width: 120px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;

 

This has given me what Hrushikesh seemed to be asking about.

[Eyup]

Hi,

Thank you for sharing your approach with our community. I'm also attaching a sample RadGrid web site to demonstrate this implementation.

You can also display the text as a link and show some kind of pop-up mechanism to display the full text on user hover. Please check the options suggested here:
http://www.telerik.com/forums/context-menu---open-a-pop-up#Qe9fJgzWrE2DhYPWX7OkCQ

Alternatively, you can use a GridTemplateColumn and place the full text within scrollable divs with fixed overall width:
http://docs.telerik.com/devtools/aspnet-ajax/controls/grid/columns/column-types#gridtemplatecolumn

Regards,
Eyup
Telerik