[Help] Problem about pressing tab key, Horizontal scroll of the gridview's header doesn't work

8 posts, 0 answers
  1. Truong
    Truong avatar
    1 posts
    Member since:
    Dec 2010

    Posted 20 Apr 2011 Link to this post

    In footer of the gridview, I have some textboxs. When I use horizontal scroll,
    then header and footer will move on following this horizontal scroll.
    But when I use tab key to move to next textbox (instead of using horizontal scroll) then footer, header and items don't move on following.
    Please help me to resolve this problem.
    Thank!!!
  2. Pavlina
    Admin
    Pavlina avatar
    6187 posts

    Posted 22 Apr 2011 Link to this post

    Hi Truong,

    Can you please specify if you have set the RadGrid1.ClientSettings.Scrolling.FrozenColumnsCount property to a value greater than 0?

    Please note that when frozen columns are used, tabbing between the textboxes in an inline edit form is not supported out-of-the-box, because the frozen columns will be scrolled together with the non-frozen. In selected scenarios, this functionality can be achieved if you subscribe to the textboxes' focus events and scroll a specific <div> with Javascript. This <div> has a client ID of "..._Frozen" where "..." is the RadGrid client ID. When doing this, you should take into account the current scroll position, and the width of the column that should be hidden/shown.

    Kind regards,
    Pavlina
    the Telerik team

    Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.

  3. Charles
    Charles avatar
    21 posts
    Member since:
    Jan 2012

    Posted 02 Jul 2013 Link to this post

    is there any example code for this workaround of scrolling the div's with '...frozen' ???
  4. Pavlina
    Admin
    Pavlina avatar
    6187 posts

    Posted 05 Jul 2013 Link to this post

    Hi Charles,

    The frozen columns functionality is implemented by hiding the RadGrid "real" scrollbar (used with the scrolling with static headers) and using a "fake" one, which triggers some columns to be hidden and shown, depending on the scrollbar position. However, when you start tabbing through the textboxes, you are beggining to scroll the complete RadGrid data area, including the frozen columns. In other words, this is the same as scrolling the "real" hidden scrollbar. This is the cause tabbing and frozen scrolling to be not supported.

    However, there is a workaround which works in a few scenarios. You should keep in mind that this is a custom code which is not universal and it will not work in all scenarios:
    function OnGridCreated(sender, args)
    {
        var frozenScroll = $get(sender.get_id() + "_Frozen");
        var allColumns = sender.get_masterTableView().get_columns();
        var scrollLeftOffset = 0;
        var allColumnsWidth = new Array;
        var grid = sender.get_element();
        for (var i = 0; i < allColumns.length; i++)
        {
            allColumnsWidth[i] = allColumns[i].get_element().offsetWidth;
        }
     
        $get(sender.get_id() + "_GridData").onscroll = function (e)
        {
            for (var i = 0; i < allColumns.length; i++)
            {
                if (!allColumns[i].get_visible())
                {
                    scrollLeftOffset += allColumnsWidth[i];
                }
                if ($telerik.isIE7)
                {
                    var thisColumn = grid.getElementsByTagName("colgroup")[0].getElementsByTagName("col")[i];
                    if (thisColumn.style.display == "none")
                    {
                        scrollLeftOffset += parseInt(thisColumn.style.width);
                    }
                }
            }
            var thisScrollLeft = this.scrollLeft;
            if (thisScrollLeft > 0)
                frozenScroll.scrollLeft = thisScrollLeft + scrollLeftOffset + 300;
            this.scrollLeft = 0;
            scrollLeftOffset = 0;
        }
    }

     

    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.
  5. MRa
    MRa avatar
    16 posts
    Member since:
    Dec 2012

    Posted 07 Aug 2013 Link to this post

    This works fine on item edit, is there any way i could apply this when a row is inserted or copied?
  6. Eyup
    Admin
    Eyup avatar
    4073 posts

    Posted 12 Aug 2013 Link to this post

    Hello Mery,

    Can you please open a support ticket to send us a very basic sample runnable web site demonstrating the behavior? Thus, we will be able to figure out your specific scenario and suggest a proper solution.

    Regards,
    Eyup
    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.
  7. Charles
    Charles avatar
    21 posts
    Member since:
    Jan 2012

    Posted 12 Aug 2013 Link to this post

    Pavlina,

    Thanks for the sample code. Unfortunately, even with using the mouse to scroll, we were never able to develop a 'usable' solution as there were just too many instances of columns being inaccessible or hidden from view. 

    We have abandoned the use of the frozen columns and will probably not revisit them until we have more time to fully develop a workable solution.

    Thanks,

    Charlie
  8. Max
    Max avatar
    2 posts
    Member since:
    Feb 2019

    Posted 24 Feb 2019 Link to this post

    I have same problems. But i dont understand that javascript code. My code skill not well.
    Can you explain javascript to me?
    --------------------------------------------------------
    RadGrid ID==>RadGridSalList

       protected void Time_TextChanged(object sender, EventArgs e)
            {

        TextBox a = (TextBox)sender;
      GridDataItem Item = (GridDataItem)a.NamingContainer;
      if (a.ID == "TBCWYearVal" || a.ID == "TBCWNYearVal")
                {
                    ((TextBox)Item.FindControl("TBCYearVal")).Text = #blabla.ToString();


                }
    if (a.ID == TBNTimeHour )
                {
                     ((Literal)Item.FindControl("LTNTimeVal")).Text = #blabla.ToString();


                }
    if (a.ID == TBOTimeHour)
                {
                     ((Literal)Item.FindControl("LTOTimeVal")).Text = #blabla.ToString();


                }
Back to Top