[Solved] RADGrid Issues

[sushma lochab]

We are using the licensed version of Telerik RadControls for ASP.NET AJAX for one of our ASP.NET project. We have some issues while using the telerik that we are unable to fix. Would really appreciate if you can provide us the fix.
1.  We have a Rich Text Column which can be multiline and font can be larger than normal text. We have to adjust the row height accordingly. Is there any option?
2. We are providing multiple broswe support in our application. But in firefox we multiple issues in the grid.
    i   Column wrapping does not work.
    ii   Right border of the grid is missing.
    iii   Width of textboxes is not proper.
    iv   Grid height issues
        (refer attached snapshots for above issues)
Any clue on these issues?

Thanks,
Sushma

[Radoslav]

Hello Sushma,

In order to change RadGrid row height  you can try to insert a <div> tag around the text content or change the height of the row on  RadGrid ItemDataBound event.
Inserting <div> tag around the text content:

<telerik:GridBoundColumn DataField="Column1" HeaderText="Large Text Column" UniqueName="Column1" DataFormatString="<div class='mydiv'>{0}</div>" >
</telerik:GridBoundColumn>

<style type="text/css" media="screen">
   .mydiv
   {
        height: 150px;
        overflow: hidden;
   }
</style>

Change the height on RadGrid1_ItemDataBound:

void RadGrid1_ItemDataBound(object sender, GridItemEventArgs e)
{
    if (!e.Item.IsInEditMode)
    {
        GridDataItem item = e.Item as GridDataItem;
        if (item != null)
        {
            if (item["ColumnName"].Text.Length > 100)
            {
                item["ColumnName "].Height = new Unit(150);
            }
        }
    }
}

As for your other questions could you please provide a bit more information on your scenario.  
Are you using the build in skin of the RadGrid or you use custom skin? Is the RadGrid TableLayout property set to Fixed?
It is hard to say what is causing these problem without seeing some code. Can you please open a support ticket and provide a sample app the recreates this problem or post some sample of your code here to the forums. We will check it and do our best to help.

Kind regards,
Radoslav
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.

[sushma lochab]

 

Hi,
Thanks for the reply.Follwing is the code that we are using for Radgrid.

<telerik:RadGrid ID="RadGrid1" Width="100%" OnGridExporting="RadGrid1_Export" OnItemDataBound="RadGrid1_ItemDatabound" OnNeedDataSource = "RadGrid1_NeedDataSource"

 

 

AllowSorting="True" PageSize="5" AllowPaging="True" runat="server" Gridlines="None">

 

 

<MasterTableView Width="100%" Summary="RadGrid table" EnableHeaderContextMenu="true" >

 

 

 

</MasterTableView>

 

 

<ClientSettings ReorderColumnsOnClient="True" AllowDragToGroup="True" AllowColumnsReorder="True" Scrolling-AllowScroll="true">

 

 

<Scrolling AllowScroll="true" UseStaticHeaders="true" ScrollHeight="100px"/>

 

 

<Resizing AllowColumnResize="true" />

 

 

</ClientSettings>

 

 

 

<PagerStyle Mode="NextPrevNumericAndAdvanced" />

 

 

</telerik:RadGrid>

This is the source code. We are using default skin for RadGrid. But still Grid border is missing in firefox and also size of textboxes is not correct in both IE and firefox.

 

[Radoslav]

Hello Sushma,

Could you please try to remove the Width="100%"  setting from RadGrid and let us know if the issue with borders still persists?
You could manually set the width of the pager's textboxes with the following css:

.rgPagerTextBox
{
   width: 30px !important;
}

Additionally  the whitespace in vertical scroll bar appears because of the scrolling and setting  UseStaticHeaders property to true. For more information on this issue, you can review this blog post.
However, to avoid it you could try to set background image to Radgrid's div to be the same as background image of the header:

.RadGrid
{
    background:#EEEEEE url(/WebResource.axd?d=vmVdXbuFmq-JDy8p8JHKTn7BWbfCKAEef5SZen-zZZbFsjlDRwPRKbCMQSx3NeId-FhDjEFBUe3LCdmMdCyObA2&t=633957966720000000) repeat-x scroll 0 -7550px !important;
}

Also the browsers do not split the word, so in the RadGrid's header you could use smaller words or you could set width of each RadGrid column.

I hope this information helps.

All the best,
Radoslav
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.

[sushma lochab]

Hi,
It worked. Thanks a lot.
-Sushma