This is a migrated thread and some comments may be shown as answers.

Grid Grouping clicking on text

3 Answers 84 Views

Grid

This is a migrated thread and some comments may be shown as answers.

3 Answers, 1 is accepted

answered on 07 Apr 2010, 07:20 AM

Hi, I tried the logic on my test page here:
http://www.ximnet.com.my/news_test.aspx

However, when I click, others header's text disappear.
Is there anything I can do to fix this?

My aspx:

    
            <%@ Page Language="VB" AutoEventWireup="false" CodeFile="news_test.aspx.vb" Inherits="news_test" %> 
        
            <%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %> 
        
            <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
        
            <html xmlns="http://www.w3.org/1999/xhtml">  
        
            <head > 
        
                <title></title>  
        
                 <link rel="stylesheet" type="text/css" href="Skins/news/Grid.Telerik.css" /> 
        
                <link href="Skins/news/Slider.Telerik.css" rel="stylesheet" type="text/css" /> 
        
                <link href="Skins/news/ComboBox.Telerik.css" rel="stylesheet" type="text/css" /> 
        
                <script src="jquery/jquery-1.3.2.min.js" type="text/javascript"></script> 
        
                 <script type="text/javascript">  
        
                   $(document).ready(function() {  
        
                   goToByScroll("bottom");  
        
                   });  
        
                   function goToByScroll(id) {  
        
                       $('html,body').animate({ scrollTop: $("#" + id).offset().top -35 }, 'slow');  
        
                   }  
        
                   function Expand(uniqueId) {  
        
                       __doPostBack('<%=gn.UniqueID %>', uniqueId);  
        
                   }     
        
                   </script> 
        
            </head> 
        
            <body> 
        
                <form id="form1" runat="server">  
        
                <telerik:radscriptmanager runat="server"></telerik:radscriptmanager> 
        
                <div> 
        
                <telerik:radajaxpanel runat="server" LoadingPanelID="lp" > 
        
                <telerik:RadGrid PageSize="10" EnableEmbeddedSkins="false" border="0" ID="gn" ShowGroupPanel="false"  runat="server" AllowPaging="True" 
        
                        AllowSorting="True" useembeddedscript="false" Skin="Telerik" Width="99%" showheader="false" CellPadding="5" 
        
                        GridLines="None" UseEmbeddedScripts="False">  
        
                        <ClientSettings AllowGroupExpandCollapse="True" /> 
        
                         <pagerstyle position="Top" mode="Slider"/>  
        
                        <MasterTableView DataKeyValue="articleID" AutoGenerateColumns="False" GridLines="None" GroupLoadMode="Client" GroupsDefaultExpanded ="false">  
        
                            <GroupByExpressions> 
        
                                <telerik:GridGroupByExpression> 
        
                                    <SelectFields> 
        
                                        <telerik:GridGroupByField FieldAlias="Caption" FieldName="Caption"></telerik:GridGroupByField> 
        
                                    </SelectFields> 
        
                                 <GroupByFields> 
        
                                   <telerik:GridGroupByField  
        
                 FieldName="livedate" 
        
                 SortOrder="Descending" /> 
        
               <telerik:GridGroupByField FieldName="id" /> 
        
             </GroupByFields> 
        
                                </telerik:GridGroupByExpression> 
        
                            </GroupByExpressions> 
        
                            <NoRecordsTemplate> 
        
                                No Issue Found</NoRecordsTemplate> 
        
                            <RowIndicatorColumn Visible="False">  
        
                                <HeaderStyle Width="20px"></HeaderStyle> 
        
                            </RowIndicatorColumn> 
        
                            <Columns> 
        
                                <telerik:GridTemplateColumn UniqueName="Caption" SortExpression="Caption" HeaderText="">  
        
                                    <HeaderStyle HorizontalAlign="left" /> 
        
                                    <ItemTemplate> 
        
                                        <%#DataBinder.Eval(Container, "DataItem.article_content")%> 
        
                                    </ItemTemplate> 
        
                                </telerik:GridTemplateColumn> 
        
                            </Columns> 
        
                        </MasterTableView> 
        
                    </telerik:RadGrid> 
        
                    </telerik:radajaxpanel> 
        
                    <telerik:RadAjaxLoadingPanel id="lp" Runat="server" height="1000" width="1000">  
        
                    <img src="images/load.gif" width="90" height="90" style="margin-top: 150px;" /> 
        
              </asp:Image> 
        
            </telerik:RadAjaxLoadingPanel> 
        
                </div> 
        
                </form> 
        
            </body> 
        
            </html>

My vb code:

    
            Imports System.Data  
        
            Imports System.Data.OleDb  
        
            Imports System.Data.SqlClient  
        
            Imports Telerik.Web.UI  
        
            Partial Class news_test  
        
                Inherits System.Web.UI.Page  
        
                Sub gn_PreRender(ByVal sender As Object, ByVal e As EventArgs) Handles gn.PreRender  
        
                    If toggledItemUniqueID <> String.Empty Then 
        
                        For Each GroupHeader As GridGroupHeaderItem In gn.MasterTableView.GetItems(GridItemType.GroupHeader)  
        
                            If GroupHeader.UniqueID = toggledItemUniqueID Then 
        
                                GroupHeader.Expanded = Not GroupHeader.Expanded  
        
                                Exit For 
        
                            End If 
        
                        Next 
        
                    End If 
        
                End Sub 
        
                Private toggledItemUniqueID As String = String.Empty  
        
                Protected Sub Page_Init(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Init  
        
                    ' gn.ItemCreated += New GridItemEventHandler(gn_ItemCreated)  
        
                    ' gn.PreRender += New EventHandler(gn_PreRender)  
        
                    Dim eventTarget As String = Request.Params.[Get]("__EVENTTARGET")  
        
                    Dim eventArgument As String = Request.Params.[Get]("__EVENTARGUMENT")  
        
                    If eventTarget = gn.UniqueID Then 
        
                        toggledItemUniqueID = eventArgument  
        
                    End If 
        
                End Sub 
        
                Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load  
        
                    If Not Page.IsPostBack Then 
        
                        LoadNews()  
        
                        If Request.QueryString("id") <> "" Then 
        
                            Dim mclas As ExodusG2.dbOps = New ExodusG2.dbOps  
        
                            Dim ssql As String = "SELECT id, article_content, cms.ParentID, cms.Caption, cms.URL, cms.livedate, articles.news_location,cms.articleID FROM cms INNER JOIN articles ON cms.articleID = articles.articleID   WHERE articles.articleID = @param1" 
        
                            Dim alin As ArrayList = New ArrayList  
        
                            alin.Add(Request.QueryString("id"))  
        
                            Dim dt As DataTable = New DataTable  
        
                            dt = GetDataTableParam(ssql, alin)  
        
                            ViewState("caption") = dt.Rows(0)("caption")  
        
                        End If 
        
                    End If 
        
                End Sub 
        
                Protected Sub gN_NeedDataSource(ByVal source As Object, ByVal e As Telerik.Web.UI.GridNeedDataSourceEventArgs) Handles gn.NeedDataSource  
        
                    Dim mClas As ExodusG2.dbOps = New ExodusG2.dbOps  
        
                    Dim dt As DataTable = New DataTable  
        
                    Dim row As DataRow  
        
                    Dim rowNew As DataRow  
        
                    Dim sSql As String 
        
                    sSql = "SELECT id, article_content, cms.ParentID, cms.Caption, cms.URL, cms.livedate, articles.news_location,cms.articleID FROM cms INNER JOIN articles ON cms.articleID = articles.articleID WHERE (((cms.ParentID)=10) AND ((cms.visibility)=1)) ORDER BY cms.livedate DESC" 
        
                    dt = GetDataTable(sSql)  
        
                    gN.DataSource = dt  
        
                End Sub 
        
                Protected Sub gN_itembound(ByVal sender As Object, ByVal e As Telerik.Web.UI.GridItemEventArgs) Handles gN.ItemDataBound  
        
                    If TypeOf e.Item Is GridGroupHeaderItem Then 
        
                        Dim item As GridGroupHeaderItem = DirectCast(e.Item, GridGroupHeaderItem)  
        
                        Dim groupDataRow As DataRowView = DirectCast(e.Item.DataItem, DataRowView)  
        
                        Dim str As String = item.DataCell.Text  
        
                        str = str.Replace("Caption:", "")  
        
                        item.DataCell.Text = "" 
        
                        Dim lname As New Label  
        
                        lname.Text = str  
        
                        If Request.QueryString("id") <> "" Then 
        
                            If ViewState("caption").ToString.Replace(" ", "") = str.Replace(" ", "") Then 
        
                                item.Expanded = True 
        
                                lname.Text = "<a name=""anchorTarget"" id=""bottom"" ></a><strong>" & str & "</strong>" 
        
                            End If 
        
                        End If 
        
                        item.DataCell.Controls.Add(lname)  
        
                    End If 
        
                End Sub 
        
                Sub LoadNews()  
        
                    Dim ssql As String 
        
                    Dim dt As DataTable  
        
                    ssql = "SELECT  cms.ParentID, cms.Caption, cms.URL, cms.livedate, articles.news_location, cms.articleID, articles.article_content, cms.ID FROM cms INNER JOIN articles ON cms.articleID = articles.articleID WHERE (((cms.ParentID)=10) AND ((cms.visibility)=1))   ORDER BY cms.livedate DESC" 
        
                    dt = GetDataTable(ssql)  
        
                    'If dt.Rows.Count > 0 Then  
        
                    '    rp_news.DataSource = dt  
        
                    '    rp_news.DataBind()  
        
                    'End If  
        
                End Sub 
        
                Public Function GetDataTableParam(ByVal query As String, ByVal params As ArrayList) As DataTable  
        
                    Dim i As Integer = 0  
        
                    If System.Configuration.ConfigurationManager.ConnectionStrings("MM_CONNECTION_STRING_SWIRL").ProviderName.ToString = "System.Data.OleDb" Then 
        
                        Dim myConn As OleDbConnection = New OleDbConnection(System.Configuration.ConfigurationManager.ConnectionStrings("MM_CONNECTION_STRING_SWIRL").ToString)  
        
                        Dim adapter1 As New OleDbDataAdapter  
        
                        Dim OLEDBCOMMAND As OleDbCommand = New OleDbCommand(query, myConn)  
        
                        With OLEDBCOMMAND.Parameters  
        
                            For i = 0 To params.Count - 1  
        
                                .Add(New System.Data.OleDb.OleDbParameter("@param" & i + 1, params(i)))  
        
                            Next 
        
                        End With 
        
                        adapter1.SelectCommand = OLEDBCOMMAND  
        
                        Dim dt As DataTable = New DataTable  
        
                        myConn.Open()  
        
                        adapter1.Fill(dt)  
        
                        myConn.Close()  
        
                        Return dt  
        
                    Else 
        
                        Dim myConnSQL As SqlConnection = New SqlConnection(System.Configuration.ConfigurationManager.ConnectionStrings("MM_CONNECTION_STRING_SWIRL").ToString)  
        
                        Dim adapter1SQL As New SqlDataAdapter  
        
                        'adapter1SQL.SelectCommand = New SqlCommand(query, myConnSQL)  
        
                        Dim mySQLCOMMAND As SqlCommand = New SqlCommand(query, myConnSQL)  
        
                        With mySQLCOMMAND.Parameters  
        
                            For i = 0 To params.Count - 1  
        
                                .Add(New System.Data.SqlClient.SqlParameter("@param" & i + 1, params(i)))  
        
                            Next 
        
                        End With 
        
                        adapter1SQL.SelectCommand = mySQLCOMMAND  
        
                        Dim dtsql As DataTable = New DataTable  
        
                        myConnSQL.Open()  
        
                        adapter1SQL.Fill(dtsql)  
        
                        myConnSQL.Close()  
        
                        Return dtsql  
        
                    End If 
        
                End Function 
        
                Public Function GetDataTable(ByVal query As String) As DataTable  
        
                    If System.Configuration.ConfigurationManager.ConnectionStrings("MM_CONNECTION_STRING_SWIRL").ProviderName.ToString = "System.Data.OleDb" Then 
        
                        Dim myConn As OleDbConnection = New OleDbConnection(System.Configuration.ConfigurationManager.ConnectionStrings("MM_CONNECTION_STRING_SWIRL").ToString)  
        
                        Dim adapter1 As New OleDbDataAdapter  
        
                        adapter1.SelectCommand = New OleDbCommand(query, myConn)  
        
                        Dim table1 As New DataTable  
        
                        myConn.Open()  
        
                        Try 
        
                            adapter1.Fill(table1)  
        
                        Finally 
        
                            myConn.Close()  
        
                        End Try 
        
                        Return table1  
        
                    Else 
        
                        Dim myConnSQL As SqlConnection = New SqlConnection(System.Configuration.ConfigurationManager.ConnectionStrings("MM_CONNECTION_STRING_SWIRL").ToString)  
        
                        Dim adapter1SQL As New SqlDataAdapter  
        
                        adapter1SQL.SelectCommand = New SqlCommand(query, myConnSQL)  
        
                        Dim table1sql As New DataTable  
        
                        myConnSQL.Open()  
        
                        Try 
        
                            adapter1SQL.Fill(table1sql)  
        
                        Finally 
        
                            myConnSQL.Close()  
        
                        End Try 
        
                        Return table1sql  
        
                    End If 
        
                End Function 
        
                Protected Sub gn_ItemCreated(ByVal sender As Object, ByVal e As GridItemEventArgs) Handles gn.ItemCreated  
        
                    If (TypeOf e.Item Is GridGroupHeaderItem) Then 
        
                        e.Item.Attributes.Add("onclick ", "return Expand('" + e.Item.UniqueID + "');")  
        
                    End If 
        
                End Sub 
        
            End Class

answered on 12 Apr 2010, 01:21 PM

radgridgroupheaderlink.zip

Hello HSLaw,

I created a sample project that demonstrates how to achieve this functionality.
Instructions:
- create the placeholder (Label) on ItemCreated
- recreate the control on ItemDataBound and then populate it

Regards,
Daniel
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.