1. #1
    Sencha User
    Join Date
    Jul 2012
    Posts
    27
    Vote Rating
    0
    dissectcode is on a distinguished road

      0  

    Default Delete a row in a grid in Architect

    Delete a row in a grid in Architect


    SOLUTION :

    grid.getView().getRow(rowIndex).style.display = 'none';

    FROM :
    http://stackoverflow.com/questions/5197933/how-to-hide-rows-in-extjs-gridpanel



    Hi - I followed this tutorial :
    http://docs.sencha.com/architect/2/#...st_desktop_app

    to build my first app. I added a delete button the end of each row and want to delete the row when clicked. OR JUST MAKING IT HIDDEN IS BETTER

    My problem is that all the information I found online give this simple solution :

    Code:
    var grid = ...; // Your grid.
    
    var button = new Ext.Button({
        text: 'Delete row',
        handler: function() {
             var record = grid.getSelectionModel().getSelected();
    
            if (record !== undefined) {
                grid.store.remove(record);
            } 
        }
    });
    but the way Architect sets up the code, there IS NO "grid" variable. There is only :

    Ext.applyIf(me, {

    How else can I get the row and delete it? Thank you

    here is the code Architect made :

    Code:
    Ext.define('MyApp.view.Cars', {
        extend: 'Ext.panel.Panel',
    
        frame: true,
        height: 536,
        width: 617,
        autoScroll: true,
        layout: {
            align: 'stretch',
            type: 'vbox'
        },
        title: 'Cars',
        titleAlign: 'center',
    
        initComponent: function() {
            var me = this;
    
            Ext.applyIf(me, {
                dockedItems: [
                    {
                        xtype: 'gridpanel',
                        flex: 1,
                        dock: 'top',
                        height: 174,
                        width: 654,
                        store: 'CarDataStore',
                        viewConfig: {
                            stateful: true,
                            enableTextSelection: false,
                            listeners: {
                                viewready: {
                                    fn: me.onGridviewViewReady,
                                    scope: me
                                }
                            }
                        },
                        columns: [
                            {
                                xtype: 'numbercolumn',
                                autoRender: false,
                                autoShow: false,
                                width: 47,
                                dataIndex: 'manufacturer',
                                text: 'ID',
                                format: '0000'
                            },
                            {
                                xtype: 'gridcolumn',
                                width: 133,
                                dataIndex: 'model',
                                text: 'File Name'
                            },
                            {
                                xtype: 'gridcolumn',
                                width: 60,
                                dataIndex: 'wiki',
                                text: 'Producer'
                            },
                            {
                                xtype: 'gridcolumn',
                                width: 244,
                                dataIndex: 'img',
                                text: 'Title'
                            },
                            {
                                xtype: 'datecolumn',
                                width: 87,
                                dataIndex: 'datePosted',
                                text: 'Date Posted',
                                format: 'm/d/Y'
                            },
                            {
                                xtype: 'actioncolumn',
                                width: 34,
                                stateful: true,
                                align: 'center',
                                menuDisabled: true,
                                items: [
                                    {
                                        handler: function(view, rowIndex, colIndex, item, e, record, row) {
    
                                            //alert("Deleting : " + row.childNodes.item(1).textContent);
                                            alert("Delete  : " + record.getData().model);
    
    
    
                                        },
                                        icon: 'data/delete.gif',
                                        tooltip: 'Remove Entry'
                                    }
                                ]
                            }
                        ],
                        listeners: {
                            select: {
                                fn: me.onGridpanelSelect,
                                scope: me
                            }
                        }
                    }
                ],
                items: [
                    {
                        xtype: 'panel',
                        flex: 1,
                        margins: '5 0 0 0',
                        height: 166,
                        itemId: 'previewPanel',
                        padding: '',
                        tpl: [
                            '<img src="data/{icon}" style="float: right" />',
                            '',
                            '<div style="padding: 5px">',
                            ' ID: {manufacturer}<br>',
                            ' File: <a href="data/{model}" target="_blank">{model}</a><br>',
                            ' Classification: {classification}<br>',
                            ' Author: {author}<br>',
                            ' Last Modified: {modified_date}<br>',
                            '</div>'
                        ],
                        title: 'Preview',
                        titleAlign: 'center'
                    },
                    {
                        xtype: 'panel',
                        flex: 1,
                        margins: '5 0 0 0',
                        height: 181,
                        width: 647,
                        layout: {
                            type: 'fit'
                        },
                        title: 'Viewing Statistics',
                        titleAlign: 'center',
                        items: [
                            {
                                xtype: 'chart',
                                height: 250,
                                itemId: 'frequencyChart',
                                width: 400,
                                animate: true,
                                insetPadding: 20,
                                store: 'CarPreviewStore',
                                axes: [
                                    {
                                        type: 'Category',
                                        fields: [
                                            'name'
                                        ],
                                        position: 'bottom'
                                    },
                                    {
                                        type: 'Numeric',
                                        fields: [
                                            'rating'
                                        ],
                                        majorTickSteps: 4,
                                        position: 'left',
                                        title: 'Frequency',
                                        maximum: 5,
                                        minimum: 0
                                    }
                                ],
                                series: [
                                    {
                                        type: 'column',
                                        label: {
                                            display: 'insideEnd',
                                            field: 'rating',
                                            color: '#333',
                                            'text-anchor': 'middle'
                                        },
                                        xField: 'name',
                                        yField: [
                                            'rating'
                                        ]
                                    }
                                ]
                            }
                        ]
                    }
                ]
            });
    
            me.callParent(arguments);
        },
    
    });

  2. #2
    Sencha - Architect Dev Team aconran's Avatar
    Join Date
    Mar 2007
    Posts
    9,182
    Vote Rating
    119
    aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold

      0  

    Default


    Hrm, not sure your specific use case, but in general I would not recommend directly manipulating the markup that Grid generates.

    Grid is a databound component and will react to all changes that happen in the store. So to remove a row in the grid, you simply remove the record from the store.
    Aaron Conran
    @aconran
    Sencha Architect Development Team

  3. #3
    Sencha User
    Join Date
    Jul 2012
    Posts
    27
    Vote Rating
    0
    dissectcode is on a distinguished road

      0  

    Default


    you're absolutely right. i got "in trouble" for doing it my shortcut way

Thread Participants: 1

Turkiyenin en sevilen filmlerinin yer aldigi xnxx internet sitemiz olan ve porn sex tarzi bir site olan mobil porno izle sitemiz gercekten dillere destan bir durumda herkesin sevdigi bir site olarak tarihe gececege benziyor. Sitenin en belirgin ozelliklerinden birisi de Turkiyede gercekten kaliteli ve muntazam, duzenli porno izle siteleri olmamasidir. Bu yuzden iste. Ayrica en net goruntu kalitesine sahip adresinde yayinlanmaktadir. Mesela diğer sitelerimizden bahsedecek olursak, en iyi hd porno video arşivine sahip bir siteyiz. "The Best anal porn videos and slut anus, big asses movies set..." hd porno faketaxi