What's New?

[CLOSED] Row Expander Grid Event Click

  1. #1
    May 14, 2014, 8:37 AM

    [CLOSED] Row Expander Grid Event Click

    Hello,
    Another question about row expander, how to attach click event on selected grid as attachment below?

    Thank You




    Aspx Code

    <%@ Page Language="vb" AutoEventWireup="false" CodeBehind="WebForm7.aspx.vb" Inherits="RowExpen.WebForm7" %>
<!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 id="Head1" runat="server">
    <title></title>
    
</head>
<body>
    <form id="Form1" runat="server">             
                 
     <ext:ResourceManager ID="ResourceManager1" runat="server" />
    <asp:ScriptManager ID="ScriptManager1" runat="server"> </asp:ScriptManager>
<ext:Viewport ID="Viewport1" runat="server" Layout="fit">
       <Items>
         <ext:GridPanel ID="GridPanel1"
            runat="server"
            Title="Expander Rows with GridPanel"
            Collapsible="true"
            AnimCollapse="true"
            Icon="Table"
            Width="600"
            Height="450"
            DisableSelection="true"
            Resizable="True">
            <Store>
                <ext:Store ID="Store1" runat="server">
                    <Model>
                        <ext:Model ID="Model1" runat="server" IDProperty="ID">
                            <Fields>
                                <ext:ModelField Name="ID" />
                                <ext:ModelField Name="Name" />
                                <ext:ModelField Name="Description" />
                            </Fields>
                        </ext:Model>
                    </Model>
                </ext:Store>
            </Store>
              
            <ColumnModel ID="ColumnModel1" runat="server">
                <Columns>
                    <ext:Column ID="Column1" runat="server" Text="ID" DataIndex="ID" Flex="1" />
                    <ext:Column ID="Column2" runat="server" Text="Name" DataIndex="Name" Flex="1" />
                    <ext:Column ID="Column3" runat="server" Text="Description" DataIndex="Description" Flex="1" />
                </Columns>
            </ColumnModel>
 
            <Plugins>
                <ext:RowExpander ID="RowExpander1" runat="server" SwallowBodyEvents="true"
                    Collapsible="true"
                    AnimCollapse="true"
                    Icon="Table"
                    Width="600"
                    AutoScroll="True"
                    Border="True" Header="false" TrackMouseOver="true" Cls="gridFont"
                    Layout="FitLayout" StripeRows="true">
 
                <Loader ID="Loader1" runat="server" DirectMethod="#{DirectMethods}.GetGrid" Mode="Component">
                    <LoadMask ShowMask="true" />
                    <Params>
                        <ext:Parameter Name="id" Value="this.record.getId()" Mode="Raw" />
                    </Params>
                 </Loader>
                </ext:RowExpander>
            </Plugins>
            <Listeners>
                <ViewReady Handler="this.view.on('beforerowupdate', rerenderNestedGrid);" />
            </Listeners>
    </ext:GridPanel>
           </Items>
   </ext:Viewport>
    </form>
</body>
</html>
    Attached Thumbnails Click image for larger version.  Name: event Click in Row Expender.png  Views: 53  Size: 14.8 KB  ID: 10991  
    Last edited by Daniil; May 21, 2014 at 7:01 AM. Reason: [CLOSED]
  2. #2
    May 14, 2014, 12:06 PM
    Hi @redi,

    What about a GridPanel's Select event?
  3. #3
    May 20, 2014, 5:14 AM
    Unfortunately we can't use select event, how about click or double click event? are there possible to be implemented on grid inside the row expander?
  4. #4
    May 20, 2014, 5:23 AM
    A GridPanel has the ItemClick and ItemDblClick events. You can try it.
  5. #5
    May 21, 2014, 2:27 AM
    Hello,
    Could you please show me where to put the ItemClick and ItemDblClick within this following code?

    Thanks 

    <%@ Page Language="vb"%>
<%@ Register assembly="Ext.Net" namespace="Ext.Net" tagprefix="ext" %>
<%@ Import Namespace="Ext.Net.Utilities"%>
<%@ Import Namespace="System.Collections.Generic"%>

<script runat="server">
    
    Protected Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs)
        If Not ExtNet.IsAjaxRequest Then
            Store1.DataSource = New Object() {New Object() {"cnt", "Rawat Jalan Description", "Ciptakridatama Rawat Jalan"},
                                     New Object() {"mdc", "Rawat Inap Description", "Ciptakridatama Rawat Inap"},
                                     New Object() {"temdcst", "Madical Description", "Ciptakridatama Madical"}
                                     }
            Store1.DataBind()

            Store2.DataSource = New Object() {New Object() {"1", "cnt", "kesehatan"},
                                New Object() {"2", "cnt", "Alat/ruang makan"},
                                New Object() {"3", "cnt", "Bahan makanan"},
                                New Object() {"3", "cnt", "Bahan makanan"},
                                New Object() {"1", "icd", "Faktor-faktor utama yang mempengaruhi status kesehatan dan kontak dengan pelayanan kesehatan"},
                                New Object() {"2", "icd", "Otot & Tulang"},
                                New Object() {"3", "icd", "Kemih"},
                                New Object() {"1", "mdc", "Analgetik Cream"},
                                New Object() {"2", "mdc", "Analgetik Injeksi"},
                                New Object() {"3", "mdc", "Antibiotik"}
                                }
            Store2.DataBind()
        End If
    End Sub
</script>

<!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 id="Head1" runat="server">
    <title></title>
</head>
<body>
    <form id="Form1" runat="server">
        <ext:ResourceManager ID="ResourceManager1" runat="server" />
    <asp:ScriptManager ID="ScriptManager1" runat="server"> </asp:ScriptManager>

             <ext:Store ID="Store1" runat="server">
                    <Model>
                        <ext:Model ID="Model1" runat="server" IDProperty="ID">
                            <Fields>
                                <ext:ModelField Name="ID" />
                                <ext:ModelField Name="Name" />
                                <ext:ModelField Name="Description" />
                            </Fields>
                        </ext:Model>
                    </Model>
                </ext:Store>

                <ext:Store ID="Store2" runat="server">
                    <Model>
                        <ext:Model ID="Model2" runat="server" IDProperty="ID">
                            <Fields>
                                <ext:ModelField Name="ID" />
                                <ext:ModelField Name="Code" />
                                <ext:ModelField Name="Name" />
                            </Fields>
                        </ext:Model>
                    </Model>
                </ext:Store>


        <ext:GridPanel ID="GridPanel1"
            runat="server"
            Title="Expander Rows with GridPanel"
            Collapsible="true"
            AnimCollapse="true"
            Icon="Table"
            Width="600"
            Height="450"
            DisableSelection="true" StoreID ="Store1">
            <ColumnModel ID="ColumnModel1" runat="server">
                <Columns>
                    <ext:Column ID="Column1" runat="server" Text="ID" DataIndex="ID" Flex="1" />
                    <ext:Column ID="Column2" runat="server" Text="Name" DataIndex="Name" Flex="1" />
                    <ext:Column ID="Column3" runat="server" Text="Description" DataIndex="Description" Flex="1" />
                </Columns>
            </ColumnModel>
        <SelectionModel>
        </SelectionModel>
        <Plugins>
            <ext:RowExpander ID="RowExpander" runat="server" SwallowBodyEvents="true" Collapsible="true" 
                             AnimCollapse="true" Icon="Table" Width="600" AutoScroll="True" Border="True" 
                             Header="false" TrackMouseOver="true" Layout="FitLayout"  StripeRows="true">  
                 <Component>
                   <ext:TabPanel ID="TabPanel1" runat="server">                    
                        <Items>
                        
                           <ext:GridPanel 
                            Collapsible="true"
                            AnimCollapse="true"
                            Icon="Table"
                            Width="200"
                            Height="200"
                            StoreID ="Store2" 
                            runat="server" 
                            ID="GridPanel2" 
                            SwallowBodyEvents="true"
                            AutoScroll="True" Border="True" 
                            Header="false" TrackMouseOver="true" Layout="FitLayout">
                            <Loader ID="Loader1" runat="server" DirectMethod="#{DirectMethods}.GetGrid" Mode="Component">
                                <LoadMask ShowMask="true" />
                                <Params>
                                    <ext:Parameter Name="id" Value="this.record.getId()" Mode="Raw" />
                                </Params>
                             </Loader>
                               <ColumnModel ID="ColumnModel2" runat="server">
                                           <Columns>
                                               <ext:Column ID="Column5" runat ="server" ColumnID="ID" DataIndex="ID" Header="ID" Resizable="true"></ext:Column>
                                               <ext:Column ID="Column7" runat ="server" ColumnID="Code" DataIndex="Code" Header="Code" Resizable="true"></ext:Column>
                                               <ext:Column ID="Column9" runat ="server" ColumnID="Name" DataIndex="Name" Header="Name" Resizable="true"></ext:Column>
                                           </Columns>
                                 </ColumnModel>
                                <View>
                                    <ext:GridView ID="GridView2" runat="server" ForceFit="false" />
                                </View>
                                <SelectionModel>
                                    <ext:RowSelectionModel ID="RowSelectionModel2" runat="server" />
                                </SelectionModel>
                                <BottomBar>
                                <ext:PagingToolbar ID="PagingToolbar2" runat="server" PageSize="10" />
                                </BottomBar>
                            </ext:GridPanel>
                        </Items>
                    </ext:TabPanel>
                </Component>
            </ext:RowExpander>
        </Plugins>

        </ext:GridPanel>
    </form>
</body>
</html>
  6. #6
    May 21, 2014, 5:17 AM
    Here you are.
    <ext:GridPanel runat="server">
    <Listeners>
        <ItemClick Handler="alert('ItemClick');" />
        <ItemDblClick Handler="alert('ItemDblClick');" />
    </Listeners>
</ext:GridPanel>
  7. #7
    May 21, 2014, 6:58 AM
    It works!

    Thank You.

Similar Threads

  1. [CLOSED] Row Expander Column Sizing and Grid Event
    By redi in forum 2.x Legacy Premium Help
    Replies: 17
    Last Post: May 22, 2014, 6:17 AM
  2. Grid Panel - Direct Event and passing data on Group click
    By reezvi in forum 1.x Help
    Replies: 0
    Last Post: Feb 03, 2013, 4:25 AM
  3. Is it possible to have both cell click and row command event of grid-panel together in same grid
    By Dorababu in forum 1.x Help
    Replies: 0
    Last Post: May 12, 2012, 11:24 AM
  4. Grid Panel - Double Click as Direct event (not working how I think it should)
    By rbarr in forum 1.x Help
    Replies: 3
    Last Post: Mar 23, 2011, 5:32 PM
  5. [CLOSED] Double click on grid inside row expander.
    By gokcemutlu in forum 1.x Legacy Premium Help
    Replies: 11
    Last Post: Jan 14, 2010, 9:45 AM

Tags for this Thread

Posting Permissions