After AJAX RadToolTipManager only working for updated Radgrids

[Kyle schultz]

I have a C#.NET page setup with a left and right RadPane. The left pane contains several radgrids situated in a RadPanelBar. (similar to an Outlook layout). In the RadPanelBar i have three RadPanelItems: one RadPanelItem contains a customer RadGrid, the second contains a customer Query Builder Form with three buttons and the third RadPanelItem contains two Grids. Those two grids contain info about saved queries and any lookup results, respectively. Here are the grid names for easy reference going forward (code will be provided below).

customerGrid, existingQueryGrid, custQueryResultsGrid

I have a RadToolTipManger assigned to customerGrid on ItemDatabound to display customer info on mouseover. I also have a separate RadToolTipManager for existingQueryGrid (also assigned target controls on databound) so the user can mouseover the saved lookup by name and view the lookup filter details.

I also have two user controls setup in the right side RadPane which contain radgrids with their own RadToolTipManager connections working in a similar way.

Scenario 1) When one submits a lookup from the query form, it populates existingQueryGrid (tooltips are bound on page load) and/or the custQueryResultsGrid depending on the query request ("save", "save and lookup" or just "lookup").Upon completion of the AJAX, any grids that were not Rebound no longer have the RadToolTips working. For example if one hits the "save" command then only the existingQueryGrid  is updated (since they only wanted to save the query) and therefore ToolTips are recreated and include a new record (works fine); however, since the customerGrid was not rebound here, the ToolTip for that Target Control set is no longer working.

Scenario 2) When one clicks a record from customerGrid, it loads the contact information into the user controls in the right pane and all the ToolTips are initialized and working when the respective user control Radgrids for Accounting and Product info are first bound. At this point the ToolTIp on the customerGrid is no longer functioning, and if  any other type of command is performed on customerGrid  like paging or filtering, the user control RadGrid ToolTips for the Accounting and Product  are no longer functiong until they are paged or sorted (at which point it works again).

All RadGrids and their respective tooltips are placed in the RadAjaxManager (and RadAjaxManager Proxy for user controls) settings so when one updates, the tooltip also should update. I am providing some relevant code:

MAIN PAGE (CLIENT SIDE)

<telerik:RadToolTipManager ID="RadToolTipManagerCustomer" Skin="Windows7" Width="300"
      OffsetX="5" Height="120" ShowDelay="500" runat="server" RelativeTo="Mouse" Position="MiddleRight"
      HideEvent="LeaveTargetAndToolTip" OnClientBeforeShow="RadToolTipCustomerBeforeShow" EnableViewState="false">
  </telerik:RadToolTipManager>
   <telerik:RadToolTipManager ID="RadToolTipQueryInfo" Skin="Windows7" Width="300"
      OffsetX="5" Height="120" ShowDelay="500" runat="server" RelativeTo="Mouse" Position="MiddleRight"
      HideEvent="LeaveTargetAndToolTip" OnClientBeforeShow="RadToolTipQueryInfo"  EnableViewState="false">
  </telerik:RadToolTipManager>
      <AjaxSettings>
          <telerik:AjaxSetting AjaxControlID="customerGrid">
              <UpdatedControls>
                  <telerik:AjaxUpdatedControl ControlID="customerGrid" LoadingPanelID="RadAjaxLoadingPanelCRM" />
                  <telerik:AjaxUpdatedControl ControlID="RadToolTipManagerCustomer" />
        </UpdatedControls>
          </telerik:AjaxSetting>
      <telerik:AjaxSetting AjaxControlID="existingQueriesGrid">
            <UpdatedControls>
                   <telerik:AjaxUpdatedControl ControlID="existingQueriesGrid" LoadingPanelID="RadAjaxLoadingPanelCRM"/>
                   <telerik:AjaxUpdatedControl ControlID="RadToolTipQueryInfo" />
            </UpdatedControls>
          </telerik:AjaxSetting>
          <telerik:AjaxSetting AjaxControlID="custQueryResultsGrid">
            <UpdatedControls>
                   <telerik:AjaxUpdatedControl ControlID="custQueryResultsGrid" LoadingPanelID="RadAjaxLoadingPanelCRM"/>
                   <telerik:AjaxUpdatedControl ControlID="RadToolTipManagerCustomer" />
            </UpdatedControls>
          </telerik:AjaxSetting>
      <telerik:AjaxSetting AjaxControlID="btnSaveQry">
             <UpdatedControls>
               <telerik:AjaxUpdatedControl ControlID="existingQueriesGrid" LoadingPanelID="RadAjaxLoadingPanelCRM"/>
               <telerik:AjaxUpdatedControl ControlID="RadToolTipQueryInfo" />
               <telerik:AjaxUpdatedControl ControlID="qryBuilderFormUpdate" LoadingPanelID="RadAjaxLoadingPanelCRM" />
             </UpdatedControls>
          </telerik:AjaxSetting>
          <telerik:AjaxSetting AjaxControlID="btnSaveAndLookup">
               <UpdatedControls>
                  <telerik:AjaxUpdatedControl ControlID="existingQueriesGrid" LoadingPanelID="RadAjaxLoadingPanelCRM"/>
                  <telerik:AjaxUpdatedControl ControlID="RadToolTipQueryInfo" />
                  <telerik:AjaxUpdatedControl ControlID="custQueryResultsGrid" LoadingPanelID="RadAjaxLoadingPanelCRM"/>
                  <telerik:AjaxUpdatedControl ControlID="RadToolTipManagerCustomer" />
                  <telerik:AjaxUpdatedControl ControlID="qryBuilderFormUpdate" LoadingPanelID="RadAjaxLoadingPanelCRM" />
               </UpdatedControls>
          </telerik:AjaxSetting>
          <telerik:AjaxSetting AjaxControlID="btnLookup">
           <UpdatedControls>
                  <telerik:AjaxUpdatedControl ControlID="custQueryResultsGrid" LoadingPanelID="RadAjaxLoadingPanelCRM"/>
                  <telerik:AjaxUpdatedControl ControlID="RadToolTipManagerCustomer" />
                  <telerik:AjaxUpdatedControl ControlID="qryBuilderFormUpdate" LoadingPanelID="RadAjaxLoadingPanelCRM" />
             </UpdatedControls>
          </telerik:AjaxSetting>
      <telerik:AjaxSetting AjaxControlID="RadAjaxManagerCRM">
              <UpdatedControls>
                  <telerik:AjaxUpdatedControl ControlID="customerGrid" LoadingPanelID="RadAjaxLoadingPanelCRM" />
                  <telerik:AjaxUpdatedControl ControlID="existingQueriesGrid" />
                  <telerik:AjaxUpdatedControl ControlID="custQueryResultsGrid" LoadingPanelID="RadAjaxLoadingPanelCRM" />
                  <telerik:AjaxUpdatedControl ControlID="qryBuilderFormUpdate" LoadingPanelID="RadAjaxLoadingPanelCRM" />
                  <telerik:AjaxUpdatedControl ControlID="RadToolTipManagerCustomer" />
                  <telerik:AjaxUpdatedControl ControlID="RadToolTipQueryInfo" />
         </UpdatedControls>
          </telerik:AjaxSetting>
    </AjaxSettings>
</telerik:RadAjaxManager>
  <telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanelCRM" EnableSkinTransparency="true"
      OnClientShowing="ClientShowingLoadingPanel" runat="server" Skin="Windows7">
  </telerik:RadAjaxLoadingPanel>

MAIN PAGE (SERVER SIDE for customerGrid)

protected void customerGrid_NeedDataSource(object source, GridNeedDataSourceEventArgs e)

    {

        if (Session["CurRepId"] != null)

        {

            ((RadGrid)CustomerGridPanelItem.FindControl("customerGrid")).DataSource = GetCompanies().Items;

        }

    }

 

protected void customerGrid_ItemDataBound(object sender, GridItemEventArgs e)

    {

        if (e.Item.ItemType == GridItemType.Item || e.Item.ItemType == GridItemType.AlternatingItem)

        {

           

            RadToolTipManagerCustomer.TargetControls.Add(((Telerik.Web.UI.GridTableCell)(e.Item.Controls[5])).ClientID, argument, true);

       

        }

    }

 

protected void customerGrid_ItemCommand(object source, GridCommandEventArgs e)

    {

        if (e.CommandName == "Sort" || e.CommandName == "Page" || e.CommandName == "Filter")

        {

            RadToolTipManagerCustomer.TargetControls.Clear();

         }

      

        if ((e.CommandName == "Filter"))

        {

            foreach (GridColumn column in e.Item.OwnerTableView.Columns)

            {

                column.CurrentFilterValue = string.Empty;

                column.CurrentFilterFunction = GridKnownFunction.NoFilter;

            }

        }

    }

 

MAIN PAGE (SERVER SIDE for existingQueryGrid)


protected void existingQueriesGrid_ItemCommand(object source, GridCommandEventArgs e)
 {
      if (e.CommandName == "Sort" || e.CommandName == "Page" || e.CommandName == "Filter")
      {
          RadToolTipQueryInfo.TargetControls.Clear();
       }

      if (e.CommandName == "RemoveQry")
      {
          deleteCustomQuery(Convert.ToInt32(e.CommandArgument));
          ((RadGrid)existingQueries.FindControl("existingQueriesGrid")).MasterTableView.Rebind();
      }
  }

protected void existingQueriesGrid_ItemDataBound(object source, GridItemEventArgs e)
  {
      if (e.Item.ItemType == GridItemType.Item || e.Item.ItemType == GridItemType.AlternatingItem)
      {

         RadToolTipQueryInfo.TargetControls.Add(((Telerik.Web.UI.GridTableCell)(e.Item.Controls[4])).ClientID,fltrArg,true);
      }
  }

 
Let me know if you need more information or code. The above code pertains to Scenario 1 but I believe once we solve (1),
we will solve (2).

Thanks in advance

[Marin Bratanov]

Hi Kyle,

This is a very strange behavior indeed. I am not sure what your project's structure is, but with such a great number of ajax settings is it possible that you get nested update panels which may result in an incorrect (unexpected) update in one of them, which may result in the clientIDs of the cells changing?

If it is so you may try using regular asp UpdatePanels with UpdateMode set to Conditional for the nested ones and call their code-behind update() method when needed. For example - you could put each Grid and its respective ToolTipManager in one update panel and in the server-side event of the appropriate button call the update() method for the appropriate panel.

You may also try turning on the ViewState of the RadToolTipManagers back on, as if an inexpected postback occurs which updates the manager it will lose its target controls when it has no viewstate. For example - let's say that a button click on button 1 should update grid 1 and tooltipmanager 1, but it also updates tooltipmanager2 (due to some incorrect ajax settings). This manager is disposed and recreated, but has not viewstate, so it has no way of reloading its target controls.

Please inspect your AJAX settings and see if the issue originates there. You can easily check that by setting the EnableAJAX property of the RadAjaxManager to false so that full postbacks occur. It would also require the viewstate for the tooltip managers.

Regards,
Marin
the Telerik team