[ACCEPTED]-How to hide rows in ExtJS GridPanel?-extjs

Accepted answer

Score: 14

You can either use one of the store.filter() methods or 9 you can hide the row element.

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

I think it's 8 much better though to just remove the record 7 from the store and let the store update 6 the view since you are deleting the record 5 and not just hiding it. With the store in 4 batch mode (the default: batch: true, restful: false), it 3 will remember which rows you've removed 2 and won't fire a request to the server until 1 you call store.save().

Score: 6

I suggest using store.FilterBy() and pass a function to 3 test the value of the value in rowToBedeleted:

store.filterBy(function(record) {
    return record.get("rowToBeDeleted") != 2;
});

I 2 wrote a basic blogpost about gridfiltering 1 a while ago, you can read it here: http://aboutfrontend.com/extjs/extjs-grid-filter/

Score: 6

In ExtJS 4.1, there is no view.getRow(..). Instead you 4 can use:

this.view.addRowCls(index, 'hidden');

to hide the row at the specified 3 index, and

this.view.removeRowCls(index, 'hidden');

to show it (where 'this' is the 2 grid).

CSS class hidden is defined as

.hidden,
{
    display: none;
}

This is useful 1 for peculiar scenarious where store.filterBy() is not appropriate.

Score: 3

In the grid js file write following code 4 to apply a CSS to those rows which you want 3 to hide.

<pre><code>
    Ext.define('MyGrid',{
    extend : 'Ext.grid.Panel',
    xtype : ''mygrid',
    viewConfig : {
       getRowClass : function(record,id){
          if(record.get('rowToBeDeleted') == 2){
             return 'hide-row';
          }
       }
    },
    .................
    .................
    });
</code></pre>

Now define a custom CSS in custom.css 2 file:

.hide-row{display:none}

This will hide rows in grid without 1 removing or filtering from store.

Score: 2

You can use the store.filter() or store.filterBy() methods for that.

Set 5 a "hidden" property on your records and 4 the filter all records that have hidden 3 set to true for example. This way they'll 2 still be present in the store but not visible 1 in the grid.

Source: stackoverflow.com

[ACCEPTED]-How to hide rows in ExtJS GridPanel?-extjs

Performing inheritance in JavaScript

Ext-JS: How to disable cell editing for individual cells in a grid?

Explain ExtJS 4 event handling

ExtJS: What's the point of requires?

how to filter a extjs store with an exact match

How to add item to Extjs panel at exact position

why is this.callParent(arguments); called at the beginning of the constructors in ExtJS?

ExtJs: Form isValid() is false. But how to know why the form is invalid?

How do I force the display of a decimal in an ExtJS NumberField to a certain precision?

Ext is not defined issue in Ext Js