[CLOSED] Problem with state and command column on dynamic grid

Hybrid View

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

    [CLOSED] Problem with state and command column on dynamic grid

    Hello

    I have a problem with command column reproducible on this example

    <%@ Page Language="C#" %>
    
    
    <!DOCTYPE html>
    
    <html>
    <head runat="server">
        <title>Simple Array Grid With Paging and Remote Reloading - Ext.NET Examples</title>
        <link href="/resources/css/examples.css" rel="stylesheet" />
    
        <script>
    
    		function testState() {
                var grid = <%= GridPanel1.ClientID %>
    
                var state = { "columns": [{ "id": "h1" }, { "id": "h3", "width": 100 }, { "id": "h2", "width": 100 }, { "id": "h4" }] };
    
                grid.applyState(state);
            }
    
            function addCommandColumn() {
                var grid = <%= GridPanel1.ClientID %>
    	        var commandColumnConfig = new Ext.grid.column.CommandColumn({
                    width: 140,
                    text:'Command column',
    		        commands: [
    			        {
    				        xtype: "button",
    				        command: "Edit",
    				        tooltip: {
    					        text: "Edit"
    				        },
    				        text: "Edit"
    			        }, {
    				        xtype: "tbseparator"
    			        }, {
    				        xtype: "button",
    				        command: "Delete",
    				        
    				        text: "Deactivate"
    			        }
    		        ]
                });
    
                var columns = [];
    
                columns.push({
    	            text: 'id',
    	            dataIndex: 'id'
                });
    
                columns.push({
    				text: 'company',
    				dataIndex: 'company'
                });
    
    	        columns.push(commandColumnConfig);
    	       // store.rebuildMeta();
    
                grid.reconfigure(columns);
    
                grid.store.add({});
                grid.store.add({});
            }
    	
    	</script>
        
    
       
    </head>
    <body>
        <form runat="server">
            <ext:ResourceManager runat="server" Namespace="" />
           
            <ext:GridPanel
                ID="GridPanel1"
                runat="server"
                Stateful="True"
                StateID="test"
                Title="Array Grid"
                Width="800">
                <Store>
                    <ext:Store ID="Store1" runat="server" PageSize="10">
                        <Model>
                            <ext:Model runat="server" IDProperty="id">
                                <Fields>
    	                            <ext:ModelField Name="id" />
                                    <ext:ModelField Name="company" />
                                   
                                </Fields>
                            </ext:Model>
                        </Model>
                    </ext:Store>
                </Store>
                <ColumnModel runat="server">
                </ColumnModel>
                <TopBar>
                    <ext:Toolbar runat="server">
                        <Items>
    	                    <ext:Button runat="server" Text="Add column" Icon="Add" Handler="addCommandColumn()" />
                            <ext:Button runat="server" Text="Test State" Icon="Printer" Handler="testState()" />
    	                    
                            
                        </Items>
                    </ext:Toolbar>
                </TopBar>
            </ext:GridPanel>
        </form>
    </body>
    </html>
    in order to reproduce the problem click Add column and then Test state
    Note that without command column in game it works fine


    Now the backround story (feel free to ignore, my problem is self demonstrated above):
    I have a grid that loads its column dynamically according the result of SQL query
    now the requirement is to have this grid statefull.

    It was relativelly tricky by its own, but I found a solution like this
    - before grid render without column set statefull to true
    - once grid render set statefull to false ( oterwise adding any new column here would trigger storing state)
    - get the previously stored state from state provider and call applyState method
    - set statefull to true ( so any change on UI will trigger saving state)

    using that seems to work without command column, but once the grid has command column the applyState throws the exception
    Last edited by fabricio.murta; Aug 02, 2022 at 3:43 PM. Reason: duplicate of 63261
  2. #2
    Hello Jiri!

    I just noticed this old thread from you, and it seems it is a duplicate of a thread with the same title in 5.x premium help forums. So just leaving a reference to the duplicate thread if anyone with the same problem ever falls in this thread instead of the one we actually handled.
    Fabrício Murta
    Developer & Support Expert

Similar Threads

  1. [CLOSED] Grid State Restore - Hidden Column
    By ecerrillos in forum 1.x Legacy Premium Help
    Replies: 11
    Last Post: Jul 11, 2014, 5:28 PM
  2. [CLOSED] Dynamic Text for command column
    By Z in forum 1.x Legacy Premium Help
    Replies: 2
    Last Post: Aug 02, 2013, 5:40 AM
  3. problem with fixing command column
    By oseqat in forum 1.x Help
    Replies: 6
    Last Post: Jul 25, 2011, 4:13 PM
  4. command column messing up grid column
    By wp_joju in forum 1.x Help
    Replies: 2
    Last Post: Dec 08, 2010, 7:40 AM
  5. [CLOSED] Dynamic grid row command
    By jchau in forum 1.x Legacy Premium Help
    Replies: 6
    Last Post: Nov 29, 2009, 7:14 PM

Posting Permissions