[Solved] RadAjaxManager Grid Rebind Problem

[Josh]

I have a RadComboBox that calls a stored procedure and rebinds the
RadGrid.  When the page first loads the Grid renders correctly.  However,
after rebinding the grid's group header rows overlap the vertical scrollbar.
Additionally, if I select a row, the highlighted row color overlaps the vertical
scrollbar.  Also, there should be no scrollbars since the data is easily
contained within the page.  They appear on the rebind.  This only happens
if I use RadAjaxManager,however, everything renders correct on the page load. 
After removing RadAjaxManager and doing a full page postback, the grid
renders correctly everytime.

I have been trying to figure this out for a week now.  Any ideas?

I dont think it matters but, grid is located in RadPageView, which is located
in a RadPane.  All widths/heights are set to 100%.  Like I said, just remove
the AjaxManager and everything works fine.

Wrapping everything in an AjaxPanel seems to work, however, I get a few
other issues that are boggling me.  I would really like to keep the AjaxManager
if possible.

Josh

[Mr. Plinko]

Are you creating the RadGrid declaratively or programatically? It is unusual to have a RadGrid that is scrolling unless you set the client setting AllowScroll to true. Also, are you using static headers?

If you could paste some of the code that you are using (and a screenshot!), it might be easier to try to figure out what the problem is. Perhaps adjusting the height percentage would work but this seems to be a truly unique situation. (I am a big proponent of the AjaxManager myself).

[Josh]

The RadGrid is created declaritively.  AllowScroll is set to true as well as
static headers.  On page startup, there are no scrollbars because the data
fits within the grid.  On rebind, when the data still fits within the grid, the
scrollbars appear as well as the overlapping of them with the row selection
and Grid Group Headers.

Additionally, I noticed when I collapse a first layer group, the GridGroup
Headers of the second layer do not hide, but look like floating text on the
Grid.  When I expand the first layer again the "ghost" text disappears and
the grid looks fine again.  BTW, the GroupLoadMode is client if it make a diff.

I am not at work now, however, I will post the code tomorrow and will get a
screenshot.  I do not know how to post screenshots, but I will try and get a
link on here.

Thanks for the help.

Josh

[Josh]

Here are the pics, code to follow.

Grid on page startup.
GridonLoad

Grid after rebind of same data.
GridError

Josh

[Josh]

Here is the relevant code.

.Net Page

<rad:RadGrid ID="Grid1"
                 runat="server"
                 AutoGenerateColumns="false"
                 DataSourceID="Grid1DS"
                 Skin="Office2007"
                 Height="100%"
                 Width="100%"
                 OnItemDataBound="Grid1_DataBound"
                 style="border:0;outline:none;">
     <ItemStyle Height="15px"
                Font-Size="X-Small"
                Wrap="false" />
     <AlternatingItemStyle Height="15px"
                           Font-Size="X-Small"
                           Wrap="false" />
     <MasterTableView DataSourceID="Grid1DS"
                      GroupLoadMode="Client"
                      ClientDataKeyNames="DataUniqueID,EventUniqueID,RequirementUniqueID"
                      TableLayout="Fixed">
      <Columns>
       ...Column data...
      </Columns>
      <GroupByExpressions>
       <rad:GridGroupByExpression>
        <GroupByFields>
         <rad:GridGroupByField FieldName="EventYear" />
        </GroupByFields>
        <SelectFields>
         <rad:GridGroupByField FieldName="EventYear" />
        </SelectFields>
       </rad:GridGroupByExpression>
       <rad:GridGroupByExpression>
        <GroupByFields>
         <rad:GridGroupByField FieldName="EventName" />
        </GroupByFields>
        <SelectFields>
         <rad:GridGroupByField FieldName="EventName" />
        </SelectFields>
       </rad:GridGroupByExpression>
      </GroupByExpressions>
     </MasterTableView>
     <ClientSettings AllowGroupExpandCollapse="true">
      <ClientEvents OnRowDblClick="EditData" />
      <Selecting AllowRowSelect="true" />
      <Scrolling AllowScroll="true" UseStaticHeaders="true" />
     </ClientSettings>
    </rad:RadGrid>

Code behind

        protected void MenuCB_SelectedIndexChanged(object sender, RadComboBoxSelectedIndexChangedEventArgs e)
        {
            Grid1DS.SelectParameters[0].DefaultValue = SelectTabComboBox.SelectedItem.Value;
            Grid1.Rebind();
        }

CSS

html,body,form
  {
   height:100%;
   margin:0;
   padding:0;
  }
  .RadGrid .rgGroupCol,
  .RadGrid .rgGroupHeader .rgGroupCol:first-child+td
  {
      padding-left:0 !important;
      padding-right:0 !important;
  }
  .RadGrid .rgGroupHeader div div div
  {
      left:-12px;
  }

[Josh]

More of .Net Page.  Just in case anyone would like to see the Splitter.

<rad:RadAjaxManager ID="AjaxManager"
                      runat="server"
                      OnAjaxRequest="AjaxManager_AjaxRequest">
  <AjaxSettings>
   <rad:AjaxSetting AjaxControlID="AjaxManager">
    <UpdatedControls>
     <rad:AjaxUpdatedControl ControlID="CurrentUser" />
     <rad:AjaxUpdatedControl ControlID="CurrentAccess" />
    </UpdatedControls>
   </rad:AjaxSetting>
   <rad:AjaxSetting AjaxControlID="LogoutButton">
    <UpdatedControls>
     <rad:AjaxUpdatedControl ControlID="LogoutButton" />
     <rad:AjaxUpdatedControl ControlID="CurrentUser" />
     <rad:AjaxUpdatedControl ControlID="CurrentAccess" />
    </UpdatedControls>
   </rad:AjaxSetting>
   <rad:AjaxSetting AjaxControlID="SelectTabComboBox">
    <UpdatedControls>
     <rad:AjaxUpdatedControl ControlID="SelectTabComboBox" />
     <rad:AjaxUpdatedControl ControlID="Grid1DS" />
     <rad:AjaxUpdatedControl ControlID="Grid1" />
    </UpdatedControls>
   </rad:AjaxSetting>
   <rad:AjaxSetting AjaxControlID="Grid1">
    <UpdatedControls>
     <rad:AjaxUpdatedControl ControlID="Grid1" />
    </UpdatedControls>
   </rad:AjaxSetting>
  </AjaxSettings>
  </rad:RadAjaxManager>

  <rad:RadSplitter ID="SplitPage"
                   runat="server"
                   Width="100%"
                   Height="100%"
                   Orientation="Horizontal"
                   PanesBorderSize="0"
                   SplitBarsSize="0">
  <rad:RadPane ID="HeaderPane"
               runat="server"
               Width="100%"
               Height="70px">
  ...Controls here...
  </rad:RadPane>
  <rad:RadPane ID="MainPane"
               runat="server"
               Width="100%"
               Height="100%">
   <rad:RadMultiPage ID="TabPages"
                     runat="server"
                     SelectedIndex="0"
                     Width="100%"
                     Height="100%">
   <rad:RadPageView ID="DetailGrid"
                    runat="server"
                    Height="100%"
                    Width="100%">
    <rad:RadGrid ID="Grid1"
                 runat="server"
                 AutoGenerateColumns="false"
                 DataSourceID="Grid1DS"
                 Skin="Office2007"
                 Height="100%"
                 Width="100%"
                 OnItemDataBound="Grid1_DataBound"
                 style="border:0;outline:none;">
     <ItemStyle Height="15px"
                Font-Size="X-Small"
                Wrap="false" />
     <AlternatingItemStyle Height="15px"
                           Font-Size="X-Small"
                           Wrap="false" />
     <MasterTableView DataSourceID="Grid1DS"
                      GroupLoadMode="Client"
                      ClientDataKeyNames="DataUniqueID,EventUniqueID,RequirementUniqueID"
                      TableLayout="Fixed">
      <Columns>
       ...Columns here...
      </Columns>
      <GroupByExpressions>
       <rad:GridGroupByExpression>
        <GroupByFields>
         <rad:GridGroupByField FieldName="EventYear" />
        </GroupByFields>
        <SelectFields>
         <rad:GridGroupByField FieldName="EventYear" />
        </SelectFields>
       </rad:GridGroupByExpression>
       <rad:GridGroupByExpression>
        <GroupByFields>
         <rad:GridGroupByField FieldName="EventName" />
        </GroupByFields>
        <SelectFields>
         <rad:GridGroupByField FieldName="EventName" />
        </SelectFields>
       </rad:GridGroupByExpression>
      </GroupByExpressions>
     </MasterTableView>
     <ClientSettings AllowGroupExpandCollapse="true">
      <ClientEvents OnRowDblClick="EditData" />
      <Selecting AllowRowSelect="true" />
      <Scrolling AllowScroll="true" UseStaticHeaders="true" />
     </ClientSettings>
    </rad:RadGrid>
   </rad:RadPageView>
   <rad:RadPageView ID="Attachments"
                     runat="server">

   </rad:RadPageView>
   <rad:RadPageView ID="QueryReport"
                    runat="server"
                    Height="100%"
                    Width="100%">
    Query Reports.
   </rad:RadPageView>
   <rad:RadPageView ID="Help"
                    runat="server"
                    Height="100%"
                    Width="100%">
    Help.
   </rad:RadPageView>
  </rad:RadMultiPage>
  </rad:RadPane>
  </rad:RadSplitter>

[Josh]

Any ideas guys.  This one is still stumping me.

Josh