IE7: Client nested view toggle - button not hiding

3 posts, 0 answers
  1. Adam
    Adam avatar
    28 posts
    Member since:
    Jun 2009

    Posted 06 Jun 2011 Link to this post

    In IE7, if a rad button appears inside a RadGrid nested view template with HierarchyLoadMode="Client", the button does not hide after the details are shown then toggled off again:

    <%@ Page Language="C#" AutoEventWireup="true" CodeFile="repro.aspx.cs" Inherits="_Default" %>
    <!doctype html>
      <form id="form1" runat="server">
      <telerik:RadScriptManager ID="RadScriptManager1" runat="server"></telerik:RadScriptManager>  
      <telerik:RadGrid ID="RadGrid1" runat="server" CellSpacing="0" GridLines="None">
        <MasterTableView HierarchyLoadMode="Client">
            <telerik:RadButton ID="RadButton1" runat="server" Text="RadButton">

    using System;
    public partial class _Default : System.Web.UI.Page
        protected void Page_Load(object sender, EventArgs e)
            RadGrid1.DataSource = new string[] { "item1", "item2" };

    Anything special I should be doing?
  2. Pero
    Pero avatar
    1156 posts

    Posted 08 Jun 2011 Link to this post

    Hello Adam,

    This issue is a well known problem in IE7 browser with elements which have position: relative applied. The RadButton element needs position relative to correctly place the icons when they are used. We have explained this issue in an article from our online documentation: To fix the issue please set posRelativeClass to the CssClass property of the RadGrid's MasterTableView, and apply the following CSS code:
    <style type="text/css">
        *+html .posRelativeClass tr
            position: relative;

    All the best,
    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. Adam
    Adam avatar
    28 posts
    Member since:
    Jun 2009

    Posted 08 Jun 2011 Link to this post

    Hi Pero, I had read that article but from it's wording it sounded like it only affects buttons placed inside a element with scroll bars which didn't seem to be the case here.
    I'll try your recommendation though, seems to make sense.
    I was also incidentally able to work around the issue using some javascript on the expand/collapse column click event:
    onclick="$find('G1_ctl00')._toggleExpand(this.parentNode, event);FixIE7ButtonHide(this);"

    function FixIE7ButtonHide(inDiv) {
        var nRow = inDiv.parentNode.parentNode.parentNode.nextSibling;
        nRow.children[1].children[0].children[0].style.display = ('none' == ? 'none' : ''); 
Back to Top