Ag-grid show number of rows

Question

I'm testing the enterprise version, and I want to know if I can show in the status bar row some custom text? (if status bar is not possible, is there an alternative?)

I want to show X rows / Y total rows of the table, or if that is not possible, just X rows

OR Indicators: Blue - Manual Deposit, Red - Failed Deposit, Green - Success (with custom style to show colors in this example)

Is this possible? (BTW, I'm using Angular 1)

Answer 1

You asked 2 different questions, and I'll try to explain both.

I want to show X rows / Y total rows of the table

You have the Y total rows at gridOptions.api.getModel().getRowCount(). The X rows I assume refers to 'current displayed rows' and I think there's no current way of getting it. We used to though, so I may be wrong.

Indicators: Blue - Manual Deposit, Red - Failed Deposit, Green - Success

I guess you're talking about changing a cell/row style? For cell styling, have a look at Column Definition cellClassRules. From the webpage:

ag-Grid allows rules to be applied to include certain classes. If you use AngularJS, then this is similar to ng-class, where you specify classes as Javascript object keys, and rules as object values.

You can use it like so:

//'Success', 'Manual' and 'Failed' are placeholders for the actual values
// you must compare to.
cellClassRules: {
    'green': function(params) { return params.value === 'Success'},
    'blue': function(params) { return params.value === 'Manual'},
    'red': function(params) { return params.value === 'Failed'}
},

For entire row styling, you can achieve it with what I explained in this other question

// Again, 'Success', 'Manual' and 'Failed' are placeholders 
// for the actual values you must compare to.
gridOptions.api.getRowStyle(params) {
    switch(params.data.myColumnToCheck){
        case 'Success':
            return {'background-color': 'green'};
        case 'Manual':
            return {'background-color': 'blue'};
        case 'Fail':
            return {'background-color': 'red'};
    }
    return null;
}