radgrid inside tooltip

[DW Web Team Member]

Hello,

I work with RadControls for ASP.NET AJAX Q3 2009. In my application inside a radtooltip I show a usercontrol (ascx) with a radgrid. Is there any way to get this radgrid object on client-side after I got the tooltip by using this:

var

 

toolTip = Telerik.Web.UI.RadToolTip.getCurrent();

And another question is if there is possible to refresh the tooltip on client-side.


Thank you

 

 

 

 

 

[Svetlina Anati]

Hello DW Web Team Member,

The controls inside the RadToolTip are on the same page and thus you can directly reference them from the main page by using their ClientID and the method $find. If you are using a separate RadToolTip and the grid is statically declared inside it you can use <%%> syntax to evaluate the ID. If you are using AJAX you can execute script from the server or use a hidden field to pass the ClientID. Basically you can consider the tooltip as a standard panel or update panel (depending on the scenario) and operate in the same manner with it.

In case you need further assistance, please provide more detailed information and sample code.


Regards,
Svetlina
the Telerik team

[Tony]

Hello, I'm trying to do something similar in that I have a RadGrid on an ascx control I am loading in a RadToolTip.

For the layout and positioning we want I have the grid inside a component 1 header content control (I have tried removing the content control with the same results).

I am running Q2 2010 for AJAX.

The problem I am having is that the scrolling is not working. When I set the scrolling of the grid to true it causes my grid to show the rows in 10px height (not enough to show one full row) although I have the grid height set to 318px. This is causing me not to be able to read the content of any row yet I am able to scroll (the scroll bar also renders at 10px height).

When I set the AllowScroll="false" the grid displays correctly but I cannot scroll.

Can you tell me how I can get my radgrid to scroll in a radtooltip and not cause this odd resizing behavior?

Here is the code I have for the .ascx:

%@ Control Language="C#" AutoEventWireup="true" CodeBehind="PropertyAccess.ascx.cs" Inherits="StayMgr.Main.Setup.PropertyAccess" %>

<%@ Register Assembly="C1.Web.UI.Controls.4" Namespace="C1.Web.UI.Controls.C1HeaderContentControl" TagPrefix="cc1" %>
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>

<div>
    <div style="font-size: 10pt; float:left; padding-top:20px;">
        <cc1:C1HeaderContentControl ID="C1HeaderContentControl1" runat="server" HeaderSize="27px" Width="620px" Height="320" UseEmbeddedVisualStyles="False" VisualStyle="StayMgr" VisualStylePath="~/Skins/C1" ContentScrollBars="None" >
            <Header>
                <div style="font-size: 10pt;">
                    <asp:Label ID="Label2" runat="server">Property Access</asp:Label>
                </div>
            </Header>
            <Content>
                <div >
                    <telerik:RadGrid ID="grdPropertyAccess" runat="server" Skin="StayMgr" Width="100%" Height="318px" EnableEmbeddedSkins="false"
                    AutoGenerateColumns="false" ShowFooter="false" ShowStatusBar="true" AllowFilteringByColumn="false" AllowSorting="false"
                    BorderStyle="None" HeaderStyle-BackColor="#C9D6E2"  AllowMultiRowSelection="false" AlternatingItemStyle-BackColor="#EFF1F4">
                        <ClientSettings EnableRowHoverStyle="false">
                            <Scrolling AllowScroll="true" UseStaticHeaders="true" />
                        </ClientSettings>
                        <GroupingSettings CaseSensitive="false" />
                        <MasterTableView Width="100%" TableLayout="Fixed" ClientDataKeyNames="hasaccess, entity, description, templateid">
                            <Columns>
                                <telerik:GridCheckBoxColumn UniqueName="colHasAccess" DataField="hasaccess" HeaderText="Has Access">
                                    <HeaderStyle Width="60px" />
                                    <ItemStyle Wrap="false" />
                                </telerik:GridCheckBoxColumn>
                                <telerik:GridBoundColumn UniqueName="colEntity" DataField="entity" HeaderText="Property">
                                    <HeaderStyle Width="80px" />
                                    <ItemStyle Wrap="false" />
                                </telerik:GridBoundColumn>
                                <telerik:GridBoundColumn UniqueName="colDescription" DataField="description" HeaderText="Description">
                                    <HeaderStyle Width="180px" />
                                    <ItemStyle Wrap="false" />
                                </telerik:GridBoundColumn>
                                <telerik:GridBoundColumn UniqueName="colSecurityTemplate" DataField="templateid" HeaderText="Security Template">
                                    <HeaderStyle Width="100px" />
                                    <ItemStyle Wrap="false" />
                                </telerik:GridBoundColumn>
                            </Columns>
                        </MasterTableView>
                    </telerik:RadGrid>
                </div>
            </Content>
        </cc1:C1HeaderContentControl>
    </div>
</div>

In the code behind I do some DataSet/DataTable mutilation... manipulation. I'll spare you the details. But I bind the grid to the default view of my DataTable and call rebind:

if( _configuringUserAccessList != null && _configuringUserAccessList.DefaultView.ToTable().Rows.Count > 1 ) {
    grdPropertyAccess.DataSource = _configuringUserAccessList.DefaultView;
    grdPropertyAccess.Rebind();
}

Thank you in advance for your help.

[Tony]

Ok, so maybe I'm just a "noob" as the kids say these days or maybe this might help someone else.

After struggling with a few other issues on the grids in different scenarios we accidentally found that if we completely remove the grid's "Height" property and set the grid's Scrolling.ScrollHeight to a value that represents the height we wanted (minus a little for the grid's header and footer) I can turn on the scrolling and the height of the grid remains the size I wanted (and, most importantly, is legible).

Her is a snippet to show how my grid looks now:

<telerik:RadGrid ID="grdPropertyAccess" runat="server" Skin="StayMgr" Width="100%" EnableEmbeddedSkins="false" AutoGenerateColumns="false" ShowFooter="false" ShowStatusBar="true" AllowFilteringByColumn="false" AllowSorting="false"
BorderStyle="None" HeaderStyle-BackColor="#C9D6E2"  AllowMultiRowSelection="false" AlternatingItemStyle-BackColor="#EFF1F4" ="grdPropertyAccess_ItemUpdated" OnItemCreated="grdPropertyAccess_ItemCreated">
  <ClientSettings EnableRowHoverStyle="false" >
    <ClientEvents OnRowCreated="RowCreated" OnRowClick="RowClick"
    OnCommand="grdPropertyAccess_Command" OnRowDestroying="RowDestroying" />
    <Scrolling AllowScroll="true" UseStaticHeaders="true" ScrollHeight="288px" />
  </ClientSettings>
  <GroupingSettings CaseSensitive="false" />
  <MasterTableView Width="100%" TableLayout="Fixed"
  ClientDataKeyNames="userid, hasaccess, entity, description, templateid,
  templatedescription" EditMode="InPlace">
    <Columns>
      <telerik:GridTemplateColumn UniqueName="colHasAccess" HeaderText="Access" >
        <HeaderStyle Width="60px" />
        <ItemStyle Wrap="false" />
        <ItemTemplate>
          <asp:Label ID="lblHasAccess" runat="server"
          Text='<%# Eval("hasaccess") %>' />
          <asp:CheckBox ID="chkHasAccess" runat="server"
          Checked='<%# Bind("hasaccess") %>' Style="display: none" />
        </ItemTemplate>
      </telerik:GridTemplateColumn>
      <telerik:GridBoundColumn UniqueName="colEntity" DataField="entity"
      HeaderText="Property">
        <HeaderStyle Width="80px" />
        <ItemStyle Wrap="false" />
      </telerik:GridBoundColumn>
      <telerik:GridBoundColumn UniqueName="colDescription" DataField="description"
      HeaderText="Description">
        <HeaderStyle Width="180px" />
        <ItemStyle Wrap="false" />
      </telerik:GridBoundColumn>
      <telerik:GridTemplateColumn UniqueName="colSecurityTemplate"
      HeaderText="Security Template">
        <HeaderStyle Width="100px" />
        <ItemTemplate>
          <%#DataBinder.Eval( Container.DataItem, "templatedescription" )%>
        </ItemTemplate>
        <EditItemTemplate>
          <telerik:RadComboBox
            DataTextField="templatedescription"
            DataValueField="templateid"
            OnItemsRequested="cboSecurityTemplate_ItemsRequested"
            EnableLoadOnDemand="True"
            AppendDataBoundItems="true"
            ID="cboSecurityTemplate"
            runat="server"
            Height="40px"
            Width="100px"
            SelectedValue='<%# Bind("templateid")%>'
            DataSourceID="securityTemplateDataSource"
            ColumnEditorID="GridDropDownListColumnEditor" >
          </telerik:RadComboBox>
        </EditItemTemplate>
      </telerik:GridTemplateColumn>
    </Columns>
  </MasterTableView>
</telerik:RadGrid>

I hope this will help someone else. Now I'm off to solve my other issues.

Thanks!

Tony

[Colin]

Thanks a lot Tony !

I was having the same problem and didn't think to remove the grid's height...

Colin