[Solved] Jump to specific column

[Tommy]

Hi,

I have a Grid with more than 100 columns. Is is possible to jump to a specific column in this Grid?

Thanks for your help
Thomas

[Dimo]

Hello Tommy,

If you mean "jump" server side, then you can use the GetColumn and GetColumnSafe methods of the RadGrid tableviews.

http://www.telerik.com/help/aspnet-ajax/telerik.web.ui-telerik.web.ui.gridtableview_members.html

If you mean to scroll horizontally to a specific column, then you can achieve this manually like this:

<%@ Page Language="C#" %>
<%@ Import Namespace="System.Data" %>
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>

<script runat="server">

    protected void RadGrid_NeedDataSource(object sender, GridNeedDataSourceEventArgs e)
    {
        DataTable dt = new DataTable();
        DataRow dr;
        int colsNum = 40;
        int rowsNum = 6;
        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>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<title>RadControls</title>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" />

<telerik:RadGrid
    ID="RadGrid1"
    runat="server"
    Width="800px"
    OnNeedDataSource="RadGrid_NeedDataSource">
    <ItemStyle Wrap="false" />
    <AlternatingItemStyle Wrap="false" />
    <ClientSettings>
        <Scrolling AllowScroll="true" UseStaticHeaders="true" ScrollHeight="" />
    </ClientSettings>
</telerik:RadGrid>

<script type="text/javascript">

Sys.Application.add_load(scrollToColumn);

function scrollToColumn()
{
    var grid = $find("<%= RadGrid1.ClientID %>");
    var colOffset = grid.get_masterTableView().getColumnByUniqueName("Column20").get_element().offsetLeft;
    grid.get_masterTableView().get_element().parentNode.scrollLeft = colOffset;
}

</script>

</form>
</body>
</html>

Sincerely yours,
Dimo
the Telerik team