RadGrid Horizontal scrolling

5 Answers 2687 Views
Grid
Amit
Top achievements
Rank 1
Amit asked on 19 Nov 2012, 09:34 AM
Hello
I have used radgrid .I have added columns dynamically to the grid at runtime.
Radgrid width is 500 px so after added 8 column horizontal scrollbar should be appear but it is not appearing.
please suggest me nice solution or example.

Thanks.

5 Answers, 1 is accepted

Sort by
0
Princy
Top achievements
Rank 1
answered on 19 Nov 2012, 09:40 AM
Hi,

In order to display horizontal scroll for navigation, you need to make sure that the total width of the columns (either auto-generated or declaratively set) exceeds the width of the grid. Also check the following demo which implements the same.
Grid / Scrolling

Thanks,
Princy.
Amit
Top achievements
Rank 1
commented on 19 Nov 2012, 10:15 AM

Thanks

My columns auto generated at server side.
In following Method I have set the width of columns so How should I come to know when my length got exceeds.

private void CreateDyanicGridColumns()
        {
            DataSet ds = this.GetDataset();
            foreach (DataColumn oDataColumn in ds.Tables[0].Columns)
            {
                GridBoundColumn oGridBoundColumn = new GridBoundColumn();
                rGrid.MasterTableView.Columns.Add(oGridBoundColumn);
                oGridBoundColumn.HeaderText = oDataColumn.Caption;
                oGridBoundColumn.DataField = oDataColumn.ColumnName;
                oGridBoundColumn.ReadOnly = true;
                oGridBoundColumn.SortExpression = oDataColumn.ColumnName;
                oGridBoundColumn.UniqueName = oDataColumn.ColumnName;
                oGridBoundColumn.FilterControlWidth = Unit.Percentage(60);
                oGridBoundColumn.HeaderStyle.Width = Unit.Percentage(10);
                oGridBoundColumn.HeaderStyle.HorizontalAlign = HorizontalAlign.Center;
                oGridBoundColumn.ItemStyle.Width = Unit.Percentage(10);
                oGridBoundColumn.ItemStyle.HorizontalAlign = HorizontalAlign.Center;
            }
 
        }
brian
Top achievements
Rank 1
commented on 15 Jun 2013, 02:22 PM

Is there an article on how to have horizontal scrolling with auto-generated columns.
Qwicksoft
Top achievements
Rank 1
commented on 09 Jan 2014, 06:28 AM

Hi All,


How to set Horizontal ScrollBar in Telerik radgrid???????
Bheki
Top achievements
Rank 1
commented on 26 Oct 2015, 02:00 PM

hi

I'm using the RadGrid and having problems with alignment, when the grid is @ "20 records" the data is aligned with the column headers and filters, left aligned, although when I change the records from 20 to 50 the scroller becomes enabled and pushes the data a few pixels to the left, is there any way to enable the scroller without pushing the data, as I am a stylist and this can be nerve wrecking to me and clients. Please help ASAP

0
Pavlina
Telerik team
answered on 21 Nov 2012, 09:31 PM
Hello,

Try using only HeaderStyle.Width property to set column width as shown below an see if this helps to show the horizontal scroll of the grid.
private void CreateDyanicGridColumns()
        {
            DataSet ds = this.GetDataset();
            foreach (DataColumn oDataColumn in ds.Tables[0].Columns)
            {
                GridBoundColumn oGridBoundColumn = new GridBoundColumn();
                rGrid.MasterTableView.Columns.Add(oGridBoundColumn);
                oGridBoundColumn.HeaderText = oDataColumn.Caption;
                oGridBoundColumn.DataField = oDataColumn.ColumnName;
                oGridBoundColumn.ReadOnly = true;
                oGridBoundColumn.SortExpression = oDataColumn.ColumnName;
                oGridBoundColumn.UniqueName = oDataColumn.ColumnName;
                oGridBoundColumn.FilterControlWidth = Unit.Percentage(60);
                oGridBoundColumn.HeaderStyle.Width = Unit.Pixel(200);
                oGridBoundColumn.HeaderStyle.HorizontalAlign = HorizontalAlign.Center;
                oGridBoundColumn.ItemStyle.HorizontalAlign = HorizontalAlign.Center;
            }
        }


Regards,
Pavlina
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
Amit
Top achievements
Rank 1
commented on 22 Nov 2012, 05:19 AM

Thank you very much it is working,
But now new problem come
I am grouping radgrid dynamically through dropdown selected value.
if I grouped radgrid and then added columns dynamically the groupheaderstyle background colour is not extended upto last column .if I scroll horizontally there is background color for those column for only initially selected and not for the newlly add columns

Please suggest 
Thanks. 
0
Pavlina
Telerik team
answered on 22 Nov 2012, 09:30 PM

Hello,

There are two points to keep in mind when modifying the grid columns on postback:
    - You must ensure that the grid is modified on Page_Init so that the control ViewState remains consistent. 
    - You should also set the EnableColumnViewState property to False, so that the grid knows that the columns may vary at some stage of the page lifecycle.

Try following these instructions and see if they help to resolve the problem with  background color of newly added columns.

Greetings,

Pavlina
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
0
Pavlina
Telerik team
answered on 16 Jun 2013, 10:28 PM
Hello,

You just need to make sure that the total width of the columns exceeds the width of the grid if you want horizontal scroll to appear in grid with autogenerated columns. Note that you should set column widths through HeaderStyle-Width property only. It is not recommended to use ItemStyle-Width.

Regards,
Pavlina
Telerik
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
0
Princy
Top achievements
Rank 1
answered on 09 Jan 2014, 09:25 AM
Hi ,

In order to set the Radgrid Scroll please set ClientSettings->Scrolling->AllowScroll="true".In order to display horizontal scroll for navigation, you need to make sure that the total width of the columns(either auto-generated or declaratively set) exceeds the width of the grid. To avoid the appearance of the vertical scroll, make sure that the height of the records in the grid does not exceed the ClientSettings -> Scrolling -> ScrollHeight scroll setting.

Thanks,
Princy

Qwicksoft
Top achievements
Rank 1
commented on 21 Feb 2014, 06:14 AM

Hi Princy,


       I m using Radcombobox inside Radgrid.
 <rad:GridTemplateColumn AutoPostBackOnFilter="true" CurrentFilterFunction="Contains"
                AllowFiltering="false" HeaderText="Status" ShowFilterIcon="false" UniqueName="Status">
                <ItemTemplate>
                    <rad:RadComboBox ID="RadComboBox1" runat="server" Width="120px" SelectedValue='<%# (Eval("Status")) %>'
                        DataValueField="Status">
                        <Items>
                            <rad:RadComboBoxItem Text="No" Value="1" />
                            <rad:RadComboBoxItem Text="Yes" Value="2" />
                            <rad:RadComboBoxItem Text="Not Applicable" Value="3" />
                        </Items>
                    </rad:RadComboBox>
                </ItemTemplate>
            </rad:GridTemplateColumn>


now i changed this combobox tat combo value is updated to database..






















Princy
Top achievements
Rank 1
commented on 21 Feb 2014, 06:43 AM

Hi,

I'm not clear about your requirement. I guess you want to save the selected values of the RadComboBox on a save button click. Please take a look at the below code snippet. Elaborate on your requirement if this doesn't help.

C#:
protected void SaveBtn_Click(object sender, EventArgs e)
{
  foreach (GridDataItem item in RadGrid1.MasterTableView.Items)
  {
    RadComboBox combo = (RadComboBox)item.FindControl("RadComboBox1");
    string value = combo.SelectedValue;// Get the selected value of each row
    // Code to save to db
  }
}

Thanks,
Princy
Tags
Grid
Asked by
Amit
Top achievements
Rank 1
Answers by
Princy
Top achievements
Rank 1
Pavlina
Telerik team
Share this question
or