This is a migrated thread and some comments may be shown as answers.

RadGrid GridTemplateColumn Horizontal Scrolling Issue

17 Answers 708 Views

Grid

This is a migrated thread and some comments may be shown as answers.

Kai asked on 26 Jun 2009, 03:38 PM

I'm currently using the trial version of RadControls for ASP.NET. What I'm trying to do is insert a web control into a GridTemplateColumn in the MasterTableView in the RadGrid control. All works out fine, but the one thing that I've been trying to get to work is to not have the horizontal scrolling. I've tried everything from the forums of using the NoPadding CSS to add to the tables, the RadGrid, and even the template columns and everything. Nothing seems to work. The one thing that I did find interesting was that if I don't use the NoPadding CSS and leave the cellspacing and cellpadding properties to the defaults, when I do get the message " Telerik.Web.UI 2009.1.527.20 trial version. Copyright telerik © 2002-2009. To remove this message, please purchase a developer version.", everything seems to fit in the RadGrid just fine (no horizontal scrolling). Is this because I have a trial version?

I can set the percentage width of the MasterTableView to like 95% and that will make it so that there is no horizontal scrolling, but when I do the drag and drop, I have all that white space on the right because the row doesn't fill up the entire table row.

Can someone help me get going in the right direction?

Thanks in advance.
Kai Thao

17 Answers, 1 is accepted

answered on 11 Aug 2009, 01:21 PM

So I finally get the chance to dig back into this, since I was put on a new project for a while. I'm still getting the horizontal scrolling issue regardless of what I try. The only thing that I did get to work is if I set the with of the MasterTableView to be around 97% or so. With this I can select the entire row and not have the extra white space and such. All my table widths are set in percentages. I did notice that the reason to why I'm getting the horizontal scroll is that when I set the MasterTable width to 100% and I get a vertical scroll bar, that adds on to the width of the MasterTable and therefore giving the table horizontal scrolling.

Is there something else I need to set in the MasterTable to account for this? If I can adjust the width of the MasterTable to take up the entire width of the RadGrid excluding the scroll bar, that would work as well. The only issue here is that I'm doing everything in percentages and that doesn't figure out to well with the exact size of the scroll bar.

Kai Thao

answered on 14 Aug 2009, 06:23 AM

Hi Kai,

Did you try my suggestion to set TableLayout="FIxed" for the MasterTableView and no width?

In addition, you can set column widths, according to your preference (in percent or in pixels). It is good to leave at least one column with no width, so that it adjusts and the MasterTableView continues to be as wide as the RadGrid control wrapper.

    
            <%@ Page Language="C#" %> 
        
            <%@ Import Namespace="System.Data" %> 
        
            <%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %> 
        
            <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
        
            "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
        
            <script runat="server"> 
        
                protected void RadGrid_NeedDataSource(object sender, GridNeedDataSourceEventArgs e) 
        
                { 
        
                    DataTable dt = new DataTable(); 
        
                    DataRow dr; 
        
                    int colsNum = 5; 
        
                    int rowsNum = 30; 
        
                    string colName = "Column"; 
        
                    for (int j = 1; j <= colsNum; j++) 
        
                    { 
        
                        dt.Columns.Add(String.Format("{0}{1}", colName, j)); 
        
                    } 
        
                    for (int i = 1; i <= rowsNum; i++) 
        
                    { 
        
                        dr = dt.NewRow(); 
        
                        for (int k = 1; k <= colsNum; k++) 
        
                        { 
        
                            dr[String.Format("{0}{1}", colName, k)] = String.Format("{0}{1} Row{2}", colName, k, i); 
        
                        } 
        
                        dt.Rows.Add(dr); 
        
                    } 
        
                    (sender as RadGrid).DataSource = dt; 
        
                } 
        
            </script> 
        
            <html xmlns="http://www.w3.org/1999/xhtml" > 
        
            <head runat="server"> 
        
            <meta http-equiv="content-type" content="text/html;charset=utf-8" /> 
        
            <title>RadControls for ASP.NET AJAX</title> 
        
            </head> 
        
            <body> 
        
            <form id="form1" runat="server"> 
        
            <asp:ScriptManager ID="ScriptManager1" runat="server" /> 
        
            <telerik:RadGrid 
        
                ID="RadGrid1" 
        
                runat="server" 
        
                OnNeedDataSource="RadGrid_NeedDataSource"> 
        
                <MasterTableView TableLayout="Fixed" /> 
        
                <ClientSettings> 
        
                    <Scrolling AllowScroll="true" UseStaticHeaders="true" /> 
        
                </ClientSettings> 
        
            </telerik:RadGrid> 
        
            </form> 
        
            </body> 
        
            </html>

Kind regards,
Dimo
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.

answered on 04 Jun 2010, 11:27 AM

grid.JPG

grid2.JPG

Team ,
i am facing issue using telerik grid.
i set scroll bar = true.
that scroll bar height coming default.
if i don't have more than 5 records grid height cant decrease.

how to decrease grid height and i want scroll bar for grid.

i want to remove the space in first image

answered on 10 Jun 2010, 10:12 AM

grid-header2.JPG

Thanks for the reply..
now i am getting the css for empty space in scrol bar.

but i am getting the empty space in header row.

i have set the row "ItemStley-wrap = false" for all my rows in grid.

i want to get the header css full in header row..

see below image.

answered on 19 Jul 2010, 08:31 PM

I was having a problem with an unwanted horizontal scrollbar showing and have been reading up on this problem in the forum. In the grid, I have set AutoGenerateColumns="False". I have set the MasterTableView TableLayout property to "Fixed". I am specifying Gridbound columns and a GridTemplateColumn in which the column widths are set in style sheets. They add up to less than the size o the grid. I am allowing scrolling, and no horizontal scrollbar shows, which is what I want.

However, when the grid is shown, the column headers are at the width they were set to in the stylesheet, but in the datarows, each of the 6 columns is the same width, like they were autogenerated so they don't line up with the headers at all. What am I doing wrong?

answered on 27 Jul 2010, 03:30 PM

gridimage.JPG

Hello,

i set the wodth for grid only i am not set any width for rows columns.

i have used grid bound columns.
i have set only client scrolls used static header.

but in my grid i am not getting the header full. i am getting empty space between grid nad scroll bar.

please can you help me how to slove this issue.

see the attached image.

Product Bundles

DevCraft

Web

Mobile

Document Management

Desktop

Reporting

Testing & Mocking

CMS

UI/UX Tools

Debugging

Free Tools

Support and Learning

Productivity and Design Tools

RadGrid GridTemplateColumn Horizontal Scrolling Issue

17 Answers, 1 is accepted