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

Border is appearing in the middle of the grid

10 Answers 109 Views
Grid
This is a migrated thread and some comments may be shown as answers.
James Faw
Top achievements
Rank 1
James Faw asked on 12 Mar 2010, 01:33 AM
    <asp:Panel ID="Panel1" runat="server" Width="800px" ScrollBars="Auto">  
        <telerik:RadGrid ID="RadGrid1" runat="server" GridLines="None"   
            AutoGenerateColumns="False" Skin="Office2007"   
            onneeddatasource="RadGrid1_NeedDataSource">  
            <MasterTableView DataKeyNames="PaymentFrequencyID" EditMode="InPlace" Width="2000px">  
                <Columns> 
                    <telerik:GridTemplateColumn DataField="Disabled" DataType="System.Boolean"   
                        HeaderText="Disabled"   
                        UniqueName="Disabled">  
                        <ItemTemplate> 
                            <asp:CheckBox ID="chkDisabled" runat="server" Checked='<%# Bind( "Disabled" ) %>' /> 
                        </ItemTemplate> 
                    </telerik:GridTemplateColumn> 
                </Columns> 
            </MasterTableView> 
            <ClientSettings> 
                <Resizing AllowColumnResize="True" /> 
            </ClientSettings> 
        </telerik:RadGrid> 
        <asp:Button ID="Button1" runat="server" Text="Button" /> 
    </asp:Panel> 
 
Here is simple page
and below is the code
    class TestDIVBorder  
    {  
        public int PaymentFrequencyID { getset; }  
        public bool Disabled { getset; }  
    }  
 
    public partial class WebForm1 : System.Web.UI.Page  
    {  
        protected void Page_Load(object sender, EventArgs e)  
        {  
        }  
 
        protected void RadGrid1_NeedDataSource(object source, Telerik.Web.UI.GridNeedDataSourceEventArgs e)  
        {  
            var list = new List<TestDIVBorder>();  
            list.Add(new TestDIVBorder() { PaymentFrequencyID = 1, Disabled = true });  
            list.Add(new TestDIVBorder() { PaymentFrequencyID = 2, Disabled = true });  
            list.Add(new TestDIVBorder() { PaymentFrequencyID = 3, Disabled = true });  
            list.Add(new TestDIVBorder() { PaymentFrequencyID = 4, Disabled = true });  
            list.Add(new TestDIVBorder() { PaymentFrequencyID = 5, Disabled = true });  
 
            RadGrid1.DataSource = list;  
        }  
    }  
 

Below you can see 2 images when scroll in different positions and you may see the line. How can I fix it?
I see it this way only in IE8.

10 Answers, 1 is accepted

Sort by
0
Dimo
Telerik team
answered on 12 Mar 2010, 08:55 AM
Hello James,

You are trying to place a 2000px-wide MasterTableView in a 800px-wide Panel, is that correct ? If so, then do one of the following:

1. Set the 2000px width to the RadGrid control, not the MasterTableView
or
2. Enable RadGrid scrolling (with our without static headers)


Kind regards,
Dimo
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
0
James Faw
Top achievements
Rank 1
answered on 12 Mar 2010, 05:51 PM
Hi Dimo

1. I am not trying to put 2000px. It is just demo (I was just going crazy and put 2000px). In real situation I have 6-15 columns depends on some conditions and I cannot fit all of them on the page.
2. Can you change my example to show me ho I can enable the scrolling?
3. And again it happens only in IE8.

Pavel Brokhman
0
Accepted
Dimo
Telerik team
answered on 15 Mar 2010, 10:40 AM
Hi Pavel,

RadGrid scrolling is enabled from the control's ClientSettings.

<ClientSettings>
       <Scrolling   ..........    />
</ClientSettings>


If you have not used this functionality before, I recommend the following help resources:

http://www.telerik.com/help/aspnet-ajax/grdbasicscrolling.html

http://www.telerik.com/help/aspnet-ajax/grdscrollwithstaticheaders.html

http://www.telerik.com/help/aspnet-ajax/height-vs-scrollheight.html


Let us know if you need more information.


Kind regards,
Dimo
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
0
James Faw
Top achievements
Rank 1
answered on 15 Mar 2010, 05:31 PM
Thank you - previous answer helped

Now I have another question. I want vertical scrolling and don't want horizontal. I mean grid will have dynamical height depends on amount of the records.
0
James Faw
Top achievements
Rank 1
answered on 25 Mar 2010, 04:38 PM
Auuu... Any suggestions.
0
Accepted
Dimo
Telerik team
answered on 26 Mar 2010, 09:28 AM
Hi James,

"I want vertical scrolling and don't want horizontal. I mean grid will have dynamical height depends on amount of the records."

I suppose you wanted to say that you want horizontal scrolling and no vertical?


Set some custom CSS class to the RadGrid control and then use:

.GridCustomClass  .rgDataDiv
{
          height: auto !important ;
}


Regards,
Dimo
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
0
James Faw
Top achievements
Rank 1
answered on 26 Mar 2010, 03:03 PM
Thanks

It works.

P.S. And yes I meant what you said :).
0
James Faw
Top achievements
Rank 1
answered on 05 Apr 2010, 03:41 PM
Apparently it doesn't work very well with IE7. I am speaking about the solution using width property. Everything is OK for IE8 or FF, but not for the IE7. What happens the grid itself is shown OK, but container get the width of the grig content.
For instant, I put width = "800px" in the grid property. Content is let's say "2000px". The grid itself the part of the table in <td>. So, grid itself is shown correctly, but td width = "2000px" now.
0
Accepted
Dimo
Telerik team
answered on 05 Apr 2010, 04:55 PM
Hello James,

This is an Internet Explorer bug, related to tables and scrollable containers. Set style="table-layout:fixed" to the <table> in which you have placed RadGrid. Alternatively, do not use tables for layout.

Greetings,
Dimo
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
0
James Faw
Top achievements
Rank 1
answered on 05 Apr 2010, 05:16 PM
I see what you mean and I tested it. Unfortunately it affect other part of the UI and when I have time I will fix it your way. By now, I just wrapped it with the <div> with width="....px">, overfloow="auto".
Tags
Grid
Asked by
James Faw
Top achievements
Rank 1
Answers by
Dimo
Telerik team
James Faw
Top achievements
Rank 1
Share this question
or