Is there a way to get the count of the child elements in pivot grid

https://snippet.webix.com/gprqv3wv
In above snippet will I be able to get the count of name column with respective to continent and form columns
Eg 1: For Repulic(Form column) the total count of name column count it is having(24(count of name with respective to Form column))
Eg 2: For Continent column there respective name column count which it is having (south America :3 (count of name) with respective to continent column)

https://snippet.webix.com/gprqv3wv
In above snippet will I be able to get the count of name column with respective to continent and form columns
Eg 1: For Repulic(Form column) the total count of name column count it is having(24(count of name with respective to Form column))
Eg 2: For Continent column there respective name column count which it is having (south America : 3 (count of name) with respective to continent column)

Hello,
For the first column of the treetable template looks like

template:"{common.treetable()} #name#"

As for your question you just need to add

columns[0].template = function(obj, common){
     return common.treetable(obj, common) + obj.name + (obj.$count ? (" (" + obj.$count + ")") : "")
}

Please, check the example: https://snippet.webix.com/1resml4u

If you want to get the count of child elements from all nesting levels you can access to datastore and count through its methods like

columns[0].template = function(obj, common){
   let childCount = 0;
   if (obj.$count)
     // template allows to refer to the table only by ID
     pivot.$$("data").data.eachSubItem(obj.id, function(subItem){
     if(!subItem.$count)
        childCount++
     })
     return common.treetable(obj, common) + obj.name + (childCount ? (" (" + childCount + ")") : "")
}

Example: https://snippet.webix.com/d9e49sbq

@Nastja Thank u so much …you made my day… :slight_smile:

@Nastja
columns[0].template = function(obj, common){
let childCount = 0;
if (obj.$count)
// template allows to refer to the table only by ID
pivot.$$(“data”).data.eachSubItem(obj.id, function(subItem){
if(!subItem.$count)
childCount++
})
return common.treetable(obj, common) + obj.name + (childCount ? (" (" + childCount + “)”) : “”)
}

In the above block itself can i fetch the value of columns (eg: oil) present outsidethan the tree structure.
I tried using obj[this.id] but it didnt workout

@Nastja …My scenario is In addition to the count of child leaf(Job count for my requirement) which is being displayed, i also need to display the count of job which are failed.I have column named “State” which has values like “Done”,“Failed”.So I should display two count
1.JobCount
2.Faild job count
Eg: Rates(2)Failed:1

As far as i know, if (i >0) //all columns except 1st, because of this condition am not able to capture the values in columns other than tree table.
I tried the below snippet bt it didnt work out bcos of (i>0):
failedJobCount is the count of failed jobs which i need

 get tableConfig() {

        const config = {
            popup: {
                width: 800, height: 600
            },

            container: this.refs.webixPivotGrid,
            id: 'pivot',
            view: 'pivot',
            height: 700,
            width: 800,
            on: {
                onBeforeRender: function (config) {
                    let pivot = this;
                    var failedJobCount = 0;
                    let columns = config.header;
                    for (let i = 0; i < columns.length; i++) {
                        if (columns[i].id.indexOf("string") != -1) {
                            columns[i].format = function (value) {
                                return value;
                            }
                        }
                        if (i > 0) {
                            var col = columns[i].id;
                            columns[i].template = function (obj, common) {
                                if (columns[i].id.indexOf("State") != -1) {

                                    var failedJobCount = (obj[this.id].match(/Failed/g) || []).length;
                                    console.log("failed" + failedJobCount);
                                }
                                if (obj.$count > 0) //has child records
                                    return "";
                                if (obj[this.id] == undefined)
                                    obj[this.id] = "";

                                return obj[this.id];
                            }
                        }
                        else {
                            columns[i].template = function (obj, common) {
                                let childCount = 0;
                                if (obj.$count)
                                    // template allows to refer to the table only by ID
                                    pivot.$$("data").data.eachSubItem(obj.id, function (subItem) {
                                        if (!subItem.$count)
                                            childCount++
                                    })
                                return common.treetable(obj, common) + obj.name + (childCount ? (" (" + childCount + ")Failed:" + failedJobCount) : "")
                            }
                        }
                    }

                },
            },
        }
        if (this.props.config) {
            for (let key in this.props.config) {
                config[key] = this.props.config[key]
            };
        };

        return config;
    }

@Nastja … Is there a possible way for the above scenario ?

Thanks

Hello,

As far as I can see, the state is stored in the column named “State”, which (I hope) corresponds to the data field in the items of your dataset.

So, all you need is to check whether the subItem - which stores the item data - has the “Failed” text in its “State” field.

let childCount = 0;
let failedJobCount = 0;
pivot.$$("data").data.eachSubItem(obj.id, function (subItem) {
     if (!subItem.$count){
            childCount++;
            if(subItem.State == "Failed")
                failedJobCount++;
     }
});

As far as i know, if (i >0) //all columns except 1st, because of this condition am not able to capture the values in columns other than tree table.

It is right, but is “State” your first column? If not, the condition doesn’t affect the logic. The correct scanario is listed above.

If other questions arise, would you please share live snippets of your implementation rather than just the code? It would be much easier to spot the problems.

Thanks @Helga …I am trying to explain with one of the webix sample itself…
https://snippet.webix.com/wjs3nbtb

In the above snippet … is there any way i can access the oil column value within the subitem block?
I am getting error as undefined when i tired to do a console.log…

Why i need it within the subItem block is because i want to append the count with “common.treetable(obj, common)”

Pivot data is aggregated according to the rules (“min”, “max”, etc.) and columns defined for display. So, the data stored in the inner Treetable (pivot.$$("data")) is already modified and contains values that differ from that in the origin dataset.

If you try to log items in the pivot.$$("data").eachSubItem callback, you will see these aggregated data:

//console.log(subItem)
{
  "$source":[ ..ids of source items...],
  "2005_'_max_'_oil":1.545,
  "2005_'_string_'_continent":"South America",
  "2006_'_max_'_oil":1.732,
  "2006_'_string_'_continent":"South America",
  ...other years
  "$count":0,
  "$parent":1528797022586,
  "$level":3
}

Please note that field names are created automatically and consist of column name (e.g. 2005), aggregation rule (e.g. max) and value (e.g. oil): 2005_‘maxoil, 2006max’_oil and so on.

So, the exact field names in the aggregated dataset depend on the current pivot structure.

If you may need to access the origin data, have a look at the item.$source array. It contains the IDs of the items that were used by Pivot to form this Pivot item (like all “oil” fields from 2005 to calculate their max value). You can access these origin items by their IDs which are stored in item.$source and get their items by pivot.getItem(id):

if(subItem.$source){
    console.log(pivot.getItem(subItem.$source[0]));
}

Like here: https://snippet.webix.com/tcdxqmzf

So, please debug your data attentively, and you will find the property that you would like to visualize.

console.log(subItem)
Object
$count:1
$level:2
$parent:1528808300231
id:1528808300232
name:“linear”
open:true
string_‘Exception:“11”
string
FinishTime:“06/05/2018 08:05:48 PM”
string
HugsGrid:“ficc_raterisk2_hugs_prod”
string
SLATime:“19:45”
string
StartTime:“06/05/2018 08:01:55 PM”
string
State:“Failed”
string
’_ViewDependency:“11”
proto:Object

I had the above values by doing a debug… but am not able to get the value by using subItem.$source or subItem.$Object

There’s an aggregated field in subItem data - string'State - with the “Failed” status. So, you can use it to count the number of failed jobs:

let childCount = 0;
let failedJobCount = 0;
pivot.$$("data").data.eachSubItem(obj.id, function (subItem) {
     if (!subItem.$count){
            childCount++;
            if(subItem["string'State"] == "Failed")
                failedJobCount++;
     }
});

If you still hesitate about the solution, please share a live snippet with a sample of JSON data that you load in your Pivot (and your Pivot config, of course).

Thanks @Helga … This subItem[“string’State”] worked out for me… Thank u so much