extjsGirdPanel.getView().getRowClass does not work 2nd time.

Question

The handler of an extjsAction button calls a function with following code.

  Add: function() {
        var window = Ext.getCmp('wndAdd');
        window.items.items[0].getStore().reload;
        var Grid1 = Ext.getCmp('grdAll');

        var grdStore2 = Ext.getCmp('grid2').getStore();
        var i = 0;
        var IDList = new Array();
        for (i = 0; i < grdStore2.data.length; i++) {

               IDList[i] =
               grdStore2.data.items[i].data['ID'];

        }

        Grid1.getView().getRowClass = function(record, index) {

            if (IDList.contains(record.data["ID"])) {
                return 'disabled-row';
            }
        };

        window.show();

    }

But the getRowClass function works only on the first button click. does ot disable the row which gets added.

Answer 1

I will edit my response with an appropriate answer once supplied more information.

When are you firing getRowClass? It seems like you are creating the function but never actually calling to for a response.

Does the function error out, get called at all, or just doesn't do what you want?

Answer 2

getRowClass only needs to be assigned one time. It is not a function that you call, it is a function called internally by the grid every time a row is rendered. Rather than assigning it inside an event handling function, it should be assigned ONE time, somewhere at the application level (e.g., wherever Grid1 itself is first configured would be the most logical place). This may or may not be your issue, depending on how your Add function is getting called, which is not clear. Bear in mind that since you rely on IDList inside getRowClass, you'll also have to have a reference to that variable that is in scope where the function is, and you will probably also have to add checks to make sure it is valid before accessing it.

You are also not showing where Grid1 is getting re-rendered. As explained above, getRowClass only executes when rows are rendered, so unless you are refreshing Grid1 somewhere not shown in your code, getRowClass will never be called.

Answer 3

Yes, the getRowClass gets called only once when the grid is configured. But i wanted something that would fire everytimewindow.show() gets fired. I used the below code on window.Onshow event.

for (var i = 0; i < Grid1.getStore().data.length; i++) {
            var element = Ext.get(Grid1.getView().getRow(i));
            var record = Grid1.getStore().getAt(i);
            if (IdList.contains(record.data.ID)) {
                element.addClass('disabled-row')
            } else {
                element.removeClass('disabled-row')
            }
        }

Answer 4

FYI, while I'm glad that you found a solution that works for you, I'm not sure you understand getRowClass still. It does NOT get called only once -- it gets called EVERY time a grid row is re-rendered (which is anytime data changes). It was only getting called once in YOUR code because your code was not set up correctly.

I don't fully understand your use case, but regardless of the window being shown, the row striping would only need to change if the grid's underlying data actually changed. When you set up the getRowClass function properly, the grid takes care of calling it for you automatically, when it needs to, and it should "just work." There should be no need for your iteration code as written which just adds extra overhead.

Again, just FYI. :)