[CLOSED] RowEditor and RowExpander do not work properly together

Hybrid View

Previous Post Previous Post   Next Post Next Post
  1. #1

    [CLOSED] RowEditor and RowExpander do not work properly together

    There is a Grid that contains a RowEditor and RowExpander.

    When the RowExpander is present, the RowEditor does not function, and an error is thrown: "Cannot read property 'lockedGrid' of undefined".

    A previously used sample code below:

    <!DOCTYPE html >
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title></title>
        <script>
            function commandHandler(grid, cmdName, record) {
                switch (cmdName) {
                    case 'cmdEdit':
                        var grid = App.Grid1;
                        grid.editingPlugin.locked = false;
                        grid.editingPlugin.startEdit(record);
                        grid.editingPlugin.locked = true;
                }
            }
        </script>
        <script runat="server">
            protected void Page_Load(object sender, EventArgs e)
            {
                if (!IsPostBack && !IsAsync)
                {
                    List<object> userList = new List<object>();
    
                    userList.Add(new { id = "1", fullname = "john doe" });
                    userList.Add(new { id = "2", fullname = "marilyn monroe" });
                    userList.Add(new { id = "3", fullname = "jack smith" });
                    userList.Add(new { id = "4", fullname = "andy murray" });
    
                    storeName.DataSource = userList;
    
                    storeName.DataBind();
                }
            }
    
            [DirectMethod]
            public string GetForm(Dictionary<string, string> parameters)
            {
                int id = Convert.ToInt32(parameters["ID"]);
    
                string name = Convert.ToString(parameters["FULLNAME"]);
    
                Ext.Net.FormPanel formRowExpander = createRowExpander(id, name);
    
                return ComponentLoader.ToConfig(formRowExpander, true);
            }
    
            public Ext.Net.FormPanel createRowExpander(int id, string name)
            {
                Ext.Net.FormPanel formPanelExpanded = new FormPanel
                {
                    Height = 200,
                    Width = 290
                };
    
                BuildGrid(formPanelExpanded);
    
                return formPanelExpanded;
            }
    
            private void BuildGrid(FormPanel frm)
            {
                Ext.Net.GridPanel grid = new Ext.Net.GridPanel
                {
                    Height = 150,
                    Width = 557
                };
    
                //BUILDING THE STORE
                Ext.Net.Store storeIDs = new Ext.Net.Store();
    
                //BUILDING THE MODEL
                Ext.Net.Model model = new Ext.Net.Model();
    
                //BUILDING THE MODELFIELDS
                Ext.Net.ModelField idfield = new Ext.Net.ModelField()
                {
                    Name = "id",
                    Type = Ext.Net.ModelFieldType.Int
                };
                Ext.Net.ModelField title = new Ext.Net.ModelField()
                {
                    Name = "title",
                    Type = Ext.Net.ModelFieldType.String
                };
                Ext.Net.ModelField isChecked = new Ext.Net.ModelField()
                {
                    Name = "isChecked",
                    Type = Ext.Net.ModelFieldType.Boolean
                };
    
                //ADDING THE FIELDS TO THE MODEL
                model.Fields.Add(idfield);
                model.Fields.Add(title);
                model.Fields.Add(isChecked);
    
                //ADDING THE MODEL TO THE STORE
                storeIDs.Model.Add(model);
    
                //BUILDING THE OBJECTS
                List<object> objectList = new List<object>();
    
                objectList.Add(new { id = 1, title = "mr", isChecked = true });
                objectList.Add(new { id = 2, title = "ms", isChecked = false });
                objectList.Add(new { id = 3, title = "mrs", isChecked = false });
    
                storeIDs.DataSource = objectList;
                storeIDs.DataBind();
    
                //ADDING THE STORE TO THE GRID
                grid.Store.Add(storeIDs);
    
                //BUILDING THE COLUMNS
                Ext.Net.Column columnId = new Ext.Net.Column()
                {
                    DataIndex = "id",
                    Hidden = true,
                    Hideable = false
                };
                Ext.Net.Column columnTitle = new Ext.Net.Column()
                {
                    DataIndex = "title",
                    Text = "Title",
                    Flex = 1
                };
                Ext.Net.CheckColumn columnIsChecked = new Ext.Net.CheckColumn()
                {
                    Text = "Assign",
                    DataIndex = "isChecked",
                    Editable = true,
                    Width = 100
                };
    
                //ADDING THE COLUMNS TO THE GRID'S COLUMN MODEL
                grid.ColumnModel.Columns.Add(columnId);
                grid.ColumnModel.Columns.Add(columnTitle);
                grid.ColumnModel.Columns.Add(columnIsChecked);
    
                frm.Items.Add(grid);
            }
        </script>
    </head>
    <body>
        <ext:ResourceManager runat="server" ID="resourceManager">
        </ext:ResourceManager>
        <form id="form1" runat="server">
            <ext:GridPanel runat="server" ID="Grid1" Height="507" Width="956" EnableLocking="false">
                <Store>
                    <ext:Store runat="server" ID="storeName">
                        <Model>
                            <ext:Model ID="Model1" runat="server">
                                <Fields>
                                    <ext:ModelField Name="id" Type="Int" />
                                    <ext:ModelField Name="fullname" Type="String" />
                                </Fields>
                            </ext:Model>
                        </Model>
                    </ext:Store>
                </Store>
                <ColumnModel runat="server">
                    <Columns>
                        <ext:Column ID="clnId" runat="server" DataIndex="id" Text="Name" Hidden="true"
                            Hideable="false" />
                        <ext:Column ID="clnFullName" runat="server" DataIndex="fullname" Flex="1" Text="Full Name">
                            <Editor>
                                <ext:TextField runat="server">
                                </ext:TextField>
                            </Editor>
                        </ext:Column>
                        <ext:CommandColumn ID="commandColumn" runat="server" Width="50">
                            <Commands>
                                <ext:GridCommand ToolTip-Text="Edit"
                                    CommandName="cmdEdit" Icon="ApplicationEdit">
                                </ext:GridCommand>
                            </Commands>
                            <Listeners>
                                <Command Fn="commandHandler"></Command>
                            </Listeners>
                        </ext:CommandColumn>
                    </Columns>
                </ColumnModel>
                <Plugins>
                    <ext:RowEditing ID="RowEditor" runat="server" AutoCancel="false">
                    </ext:RowEditing>
                    <ext:RowExpander runat="server" ID="rowExpander">
                        <Loader ID="Loader1" runat="server" DirectMethod="#{DirectMethods}.GetForm" Mode="Component">
                            <LoadMask Msg="Loading" ShowMask="true" />
                            <Params>
                                <ext:Parameter Name="ID" Value="this.record.data.id" Mode="Raw" />
                                <ext:Parameter Name="FULLNAME" Value="this.record.data.fullname" Mode="Raw" />
                            </Params>
                        </Loader>
                    </ext:RowExpander>
                </Plugins>
            </ext:GridPanel>
        </form>
    </body>
    </html>
    I am guessing this error is thrown when the isLocked function is called for the RowExpander's expandColumn, but I could be mistaken.

    I am also getting the following error "Cannot read property 'apply' of undefined" when the Grid is loaded.

    When the RowExpander is removed, there are no more errors and the Grid and RowEditor work perfectly.
    Last edited by Daniil; Feb 17, 2015 at 1:55 PM. Reason: [CLOSED]
  2. #2
    FpNetWorth, at revision 6325, i did got the errors mentioned by you. Can you list the steps to reproduce the issue?

    Click image for larger version. 

Name:	re001.png 
Views:	4 
Size:	4.0 KB 
ID:	20971

    Click image for larger version. 

Name:	re002.png 
Views:	3 
Size:	5.9 KB 
ID:	20981

    Click image for larger version. 

Name:	re003.png 
Views:	3 
Size:	5.7 KB 
ID:	20991
  3. #3
    Hi, @RCN.

    I'm currently on the base EXT 3.0. Will update to the latest revision and test accordingly.

    However, there are some difficulties in the update as I can't get the build to work on .NET 4.0 framework, and I will be posting a thread about this issue.
  4. #4
    I'm currently on the base EXT 3.0. Will update to the latest revision and test accordingly.
    Ext.Net 3.1 is much more stable than 3.0, you will notice that.
    However, there are some difficulties in the update as I can't get the build to work on .NET 4.0 framework, and I will be posting a thread about this issue.
    Keep us posted. It would be great to help you on this matter.
    Last edited by RCN; Feb 12, 2015 at 10:49 AM.
  5. #5
    Ext.Net 3.1 is much more stable than 3.0, you will notice that.
    I agree and the difference is already noticed. I have successfully updated to 3.1. It turns out the I had the wrong target build for Ext; .NET 4.5 is targeted by default, whereas I am targeting 4.0.

    Also, the above issue has been resolved with the update.

    Thank you for your help as always.

    This thread can now be closed.
  6. #6
    You're welcome.

Similar Threads

  1. [CLOSED] Tree Panel does not work properly
    By IleanaTopete in forum 2.x Legacy Premium Help
    Replies: 6
    Last Post: Jan 26, 2015, 3:56 AM
  2. [CLOSED] Tabs does not work properly
    By jesperhp in forum 2.x Legacy Premium Help
    Replies: 7
    Last Post: Feb 19, 2014, 2:59 AM
  3. RowExpander RowEditor
    By sharif in forum Examples and Extras
    Replies: 4
    Last Post: Nov 20, 2012, 7:47 AM
  4. Replies: 2
    Last Post: Sep 16, 2012, 3:57 PM
  5. Replies: 1
    Last Post: Jun 06, 2012, 12:33 PM

Tags for this Thread

Posting Permissions