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

Position radgrid vertical scroll bar on the left side of the grid

11 Answers 404 Views
Grid
This is a migrated thread and some comments may be shown as answers.
DasNugget
Top achievements
Rank 2
DasNugget asked on 16 Dec 2008, 05:29 PM
can this be done?

11 Answers, 1 is accepted

Sort by
0
Dimo
Telerik team
answered on 16 Dec 2008, 05:35 PM
Hi DasNugget,

RadGrid scrollbars are automatically moved to the other side if the control is in RTL mode. I suppose you don't want to switch to RTL mode, so here is another tricky way to achieve the same thing:

Add the following CSS rules to your application:


.GridDataDiv_SkinName
{
      direction: rtl;
}

.GridDataDiv_SkinName table
{
     direction: ltr;
}


Regards,
Dimo
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.
0
DasNugget
Top achievements
Rank 2
answered on 16 Dec 2008, 05:45 PM
Thanks, that does work nicely with one caveat:

It's a long, wide grid so i'm using static headers and desire the scroll bar on the left.

But now the static headers are out of alignment with the grid columns by the width of the scroll bar.

Do you have another magic trick to offset the static header by the scroll bar width?

 
0
Dimo
Telerik team
answered on 17 Dec 2008, 08:28 AM
Hello DasNugget,

Yes, I have another magic trick, but as far as I can see, all these hacks do not work very well in all browsers and scenarios. That's why, please remove the previously provided CSS rules and use these:

.MyRadGrid
{
    direction: rtl;
}

.MyRadGrid table
{
     direction: ltr;
}


<telerik:RadGrid  CssClass="MyRadGrid"  />


Best wishes,
Dimo
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.
0
Dhamodharan
Top achievements
Rank 1
answered on 21 Dec 2011, 02:26 PM
Hi it is working IE correctly. but firefox is not working in this vertical scroll bar.

Please let me know how to fix this one.

Thanks,
Dhamu.
0
Karl
Top achievements
Rank 1
answered on 30 Jun 2014, 02:45 PM
For anyone who is still interested in this old thread, as I was, the problem lies in forgetting to include the Radgrid's header styles in the css. 

Note, below uses the default skin.  If you are using another skin, you may need to add the "_SkinName" suffix to the name of the divs or, better yet, take two seconds to look at the actual Telerik-generated HTML code (right click your web page and select "view source") and double check.
‚Äč
.rgHeaderWrapper
{
direction: rtl;
}

.rgHeaderWrapper table
{
direction: ltr;
}

.rgDataDiv
{
direction: rtl;
}

.rgDataDiv table
{
direction: ltr;
}
0
Aruna
Top achievements
Rank 1
answered on 22 Aug 2014, 10:30 AM
Hi
                   <ClientSettings >
                          <Scrolling AllowScroll="True" UseStaticHeaders="true" />
                    </ClientSettings>

Here i set vertical Scroll in RadGrid,its working fine in Chrome and firefox.but in ie-10 the vertical scroll bar background color is Black.
i want to set the scroll bar background color.Please Reply me soon...
0
Pavlina
Telerik team
answered on 22 Aug 2014, 02:55 PM
Hello,

A possible reason for the described problem could be a RadFormDecorator on the page with Black skin. If this is the cause for the unwanted behaviour please remove the Skin or set the one you use for the RadGrid control.
 
Regards,
Pavlina
Telerik
 

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

 
0
Aruna
Top achievements
Rank 1
answered on 28 Nov 2014, 10:39 AM
Hi,
          <rad:GridTemplateColumn UniqueName="Qty" AllowFiltering="false" HeaderText="Quantity">
                                <ItemTemplate>
                                    <rad:RadTextBox ID="txtbqty" runat="server" Text='<%# Bind("Qty") %>' BorderColor="White"
                                        BorderStyle="None" Width="100px" autopostback="false"OnTextChanged="txtbqty_Textchanged">
                                    </rad:RadTextBox>                                    
                                </ItemTemplate>
                            </rad:GridTemplateColumn>      here ,how to fire txtbqty_Textchanged event? i used this txtbqty_Textchanged,but it is not working,please help me...


0
Konstantin Dikov
Telerik team
answered on 02 Dec 2014, 12:35 PM
Hello Aruna,

The server-side OnTextChanged event of the RadTextBox will be fired on the first postback that occurs after you change the text. If you need the event to fire after you change the text and after blurring the input element you can set the AutoPostBack property to true:
<telerik:RadGrid runat="server" ID="RadGrid1" OnNeedDataSource="RadGrid1_NeedDataSource" Width="100px">
    <MasterTableView AutoGenerateColumns="false">
        <Columns>
            <telerik:GridTemplateColumn UniqueName="Qty" AllowFiltering="false" HeaderText="Quantity">
                <ItemTemplate>
                    <telerik:RadTextBox ID="txtbqty" runat="server" Text='<%# Bind("ID") %>' BorderColor="White"
                        BorderStyle="None" Width="100px" AutoPostBack="true" OnTextChanged="txtbqty_TextChanged">
                    </telerik:RadTextBox>
                </ItemTemplate>
            </telerik:GridTemplateColumn>
        </Columns>
    </MasterTableView>
</telerik:RadGrid>

And the code-behind:
protected void RadGrid1_NeedDataSource(object sender, GridNeedDataSourceEventArgs e)
{
    DataTable table = new DataTable();
    table.Columns.Add("ID", typeof(int));
    for (int i = 0; i < 5; i++)
    {
        table.Rows.Add(i);
    }
 
    (sender as RadGrid).DataSource = table;
}
 
protected void txtbqty_TextChanged(object sender, EventArgs e)
{
     
}

Hope this helps.


Regards,
Konstantin Dikov
Telerik
 

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

 
0
Aruna
Top achievements
Rank 1
answered on 08 Dec 2014, 06:41 AM
Hi ,

       I have used RadAjaxManager,to avoid flickering in radgrid,Everything works well except When i click on EDIT image button.In Radgrid It suppose to open a radwindow but it is not opening.


           <rad:GridButtonColumn ButtonType="ImageButton" ImageUrl="~/Images/edit2.png" CommandName="EditCol"
                                    UniqueName="editbuttoncolumn" HeaderText="Edit" HeaderStyle-Width="30">
          </rad:GridButtonColumn>
0
Konstantin Dikov
Telerik team
answered on 10 Dec 2014, 12:34 PM
Hello Aruna,

Can you please share you logic for opening the RadWindow for editing, so we can examine it and determine what could be the root of the problem.

Additionally, can you please elaborate on the version that you are currently using?

I am looking forward to your reply.


Regards,
Konstantin Dikov
Telerik
 

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

 
Tags
Grid
Asked by
DasNugget
Top achievements
Rank 2
Answers by
Dimo
Telerik team
DasNugget
Top achievements
Rank 2
Dhamodharan
Top achievements
Rank 1
Karl
Top achievements
Rank 1
Aruna
Top achievements
Rank 1
Pavlina
Telerik team
Konstantin Dikov
Telerik team
Share this question
or