Showing detail records in a new window, by clicking on a row in RadGrid

Thread is closed for posting
1 posts, 0 answers
  1. Telerik Admin
    Telerik Admin avatar
    1679 posts
    Member since:
    Oct 2004

    Posted 25 Jan 2008 Link to this post

    Requirements

    RadControls version

    RadControls Prometheus Q3 2007
    (RadGrid and RadWindow)

    .NET version

    2.0            

    Visual Studio version

    2005    

    programming language

    c#

    browser support

    all browsers supported by RadControls


     
  2. PROJECT DESCRIPTION
    The following code sample uses RadGrid and RadWindow. Upon clicking a row in the grid, a window is opened, which contains information related to the row. The id is retrieved from the row via JavaScript, and passed to the window as a query string. The query string, in turn, is used as a select parameter for the query in the newly opened window. Below is the code used in the sample:

    Default.aspx
     <script type="text/javascript">  
          
          
        function RowClick(sender, eventArgs)  
        {          
            var MasterTableView = eventArgs.get_tableView();          
            var cell = MasterTableView.getCellByColumnUniqueName(MasterTableView.get_dataItems()[eventArgs.get_itemIndexHierarchical()], "CustomerID");               
             var oWnd = radopen("Details.aspx?CustomerID=" +cell.innerHTML );  
        }  
        
        </script> 
          
            <asp:ScriptManager ID="ScriptManager1" runat="server" /> 
            <telerik:RadGrid ID="RadGrid1" runat="server" DataSourceID="AccessDataSource1" 
                GridLines="None">  
                <ExportSettings> 
                    <Pdf FontType="Subset" PaperSize="Letter" /> 
                    <Excel Format="Html" /> 
                </ExportSettings> 
                <MasterTableView AutoGenerateColumns="False" CommandItemDisplay="None" CurrentResetPageIndexAction="SetPageIndexToFirst" 
                    DataKeyNames="CustomerID" DataSourceID="AccessDataSource1" Dir="LTR" Frame="Border" 
                    TableLayout="Auto">  
                    <RowIndicatorColumn CurrentFilterFunction="NoFilter" FilterListOptions="VaryByDataType" 
                        Visible="False">  
                        <HeaderStyle Width="20px" /> 
                    </RowIndicatorColumn> 
                    <ExpandCollapseColumn CurrentFilterFunction="NoFilter" FilterListOptions="VaryByDataType" 
                        Resizable="False" Visible="False">  
                        <HeaderStyle Width="20px" /> 
                    </ExpandCollapseColumn> 
                    <Columns> 
                        <telerik:GridBoundColumn CurrentFilterFunction="NoFilter" DataField="CustomerID" 
                            FilterListOptions="VaryByDataType" ForceExtractValue="None" HeaderText="CustomerID" 
                            ReadOnly="True" SortExpression="CustomerID" UniqueName="CustomerID">  
                        </telerik:GridBoundColumn> 
                        <telerik:GridBoundColumn CurrentFilterFunction="NoFilter" DataField="CompanyName" 
                            FilterListOptions="VaryByDataType" ForceExtractValue="None" HeaderText="CompanyName" 
                            SortExpression="CompanyName" UniqueName="CompanyName">  
                        </telerik:GridBoundColumn> 
                        <telerik:GridBoundColumn CurrentFilterFunction="NoFilter" DataField="ContactName" 
                            FilterListOptions="VaryByDataType" ForceExtractValue="None" HeaderText="ContactName" 
                            SortExpression="ContactName" UniqueName="ContactName">  
                        </telerik:GridBoundColumn> 
                        <telerik:GridBoundColumn CurrentFilterFunction="NoFilter" DataField="ContactTitle" 
                            FilterListOptions="VaryByDataType" ForceExtractValue="None" HeaderText="ContactTitle" 
                            SortExpression="ContactTitle" UniqueName="ContactTitle">  
                        </telerik:GridBoundColumn> 
                    </Columns> 
                    <EditFormSettings> 
                        <EditColumn CurrentFilterFunction="NoFilter" FilterListOptions="VaryByDataType">  
                        </EditColumn> 
                    </EditFormSettings> 
                </MasterTableView> 
                  
                <ClientSettings> 
                <ClientEvents OnRowClick="RowClick" />              
                </ClientSettings>              
            </telerik:RadGrid> 
              
            <telerik:RadWindowManager runat="server">   
            </telerik:RadWindowManager> 
              
            <asp:AccessDataSource ID="AccessDataSource1" runat="server" DataFile="~/App_Data/Nwind.mdb" 
                SelectCommand="SELECT TOP 10 [CustomerID], [CompanyName], [ContactName], [ContactTitle] FROM [Customers]">  
            </asp:AccessDataSource> 
              
            <div> 
            </div> 
        </form> 

    Details.aspx
        <form id="form1" runat="server">  
        <div> 
          
        <asp:ScriptManager ID="ScriptManager1" runat="server" /> 
          
            <telerik:RadGrid ID="RadGrid1" runat="server" DataSourceID="AccessDataSource1" GridLines="None">  
                <ExportSettings> 
                    <Pdf FontType="Subset" PaperSize="Letter" /> 
                    <Excel Format="Html" /> 
                </ExportSettings> 
                <MasterTableView CommandItemDisplay="None" CurrentResetPageIndexAction="SetPageIndexToFirst" 
                    DataSourceID="AccessDataSource1" Dir="LTR" Frame="Border" TableLayout="Auto">  
                    <RowIndicatorColumn CurrentFilterFunction="NoFilter" FilterListOptions="VaryByDataType" 
                        Visible="False">  
                        <HeaderStyle Width="20px" /> 
                    </RowIndicatorColumn> 
                    <ExpandCollapseColumn CurrentFilterFunction="NoFilter" FilterListOptions="VaryByDataType" 
                        Resizable="False" Visible="False">  
                        <HeaderStyle Width="20px" /> 
                    </ExpandCollapseColumn> 
                    <EditFormSettings> 
                        <EditColumn CurrentFilterFunction="NoFilter" FilterListOptions="VaryByDataType">  
                        </EditColumn> 
                    </EditFormSettings> 
                </MasterTableView> 
            </telerik:RadGrid> 
          
        <asp:AccessDataSource   
                    ID="AccessDataSource1"   
                    DataFile="~/App_Data/Nwind.mdb"   
                    runat="server"   
                    SelectCommand="SELECT * FROM [Orders] WHERE [CustomerID] = @CustomerID" 
                    > 
                    <SelectParameters> 
                    <asp:Parameter Name="CustomerID" Type="string" /> 
                    </SelectParameters> 
        </asp:AccessDataSource> 
        </div> 
        </form> 

    Default.aspx.cs
     protected void Page_Load(object sender, EventArgs e)  
        {  
            if (Request["CustomerID"] != null)  
            {  
                Page.Title = "Details for Customer ID: " + Request["CustomerID"];  
                AccessDataSource1.SelectParameters["CustomerID"].DefaultValue = Request["CustomerID"];  
            }  
     
        } 
  • Back to Top