Filter json response data table using jQuery in another json object

Question

I want to filter my JSON response which is in form of data table row column like this, which have more than 100 rows. Now I want to filter data on the ModelName like modelName =Buc98 and also want to remove the ModelName Column and their respective value from each rows.

{
    "cols": [
        {
            "type": "datetime",
            "id": "ModelDate",
            "label": "ModelDate"
        },
        {
            "type": "string",
            "id": "ModelName",
            "label": "ModelName"
        },
        {
            "type": "number",
            "id": "value",
            "label": "value"
        }
    ],
    "rows": [
        {
            "c": [
                {
                    "v": "Date(2012, 0, 1, 0, 0, 0)"
                },
                {
                    "v": "Buc98"
                },
                {
                    "v": 100
                }
            ]
        }
    ]
}

Answer 1

The key to problems like this is to get the model in to a form that is easier to use first. Something like this:

{
    "cols": [
        {
            "type": "datetime",
            "id": "ModelDate",
            "label": "ModelDate"
        },
        {
            "type": "string",
            "id": "ModelName",
            "label": "ModelName"
        },
        {
            "type": "number",
            "id": "value",
            "label": "value"
        }
    ],
    "rows": [
        {
            "ModelDate": "Date(2012, 0, 1, 0, 0, 0)",
            "ModelName": "Buc98",
            "value": 100
        }
    ]
}

So we'll do that :o)

var data = {
    "cols": [
        {
            "type": "datetime",
            "id": "ModelDate",
            "label": "ModelDate"
        },
        {
            "type": "string",
            "id": "ModelName",
            "label": "ModelName"
        },
        {
            "type": "number",
            "id": "value",
            "label": "value"
        }
    ],
    "rows": [
        {
            "c": [
                {
                    "v": "Date(2012, 0, 1, 0, 0, 0)"
                },
                {
                    "v": "Buc98"
                },
                {
                    "v": 100
                }
            ]
        }
    ]
}

//first get a list of the column id's
var colCount = data.cols.length;
var columnIds = [];
for (var i = 0; i < colCount; i++){
    columnIds.push(data.cols[i].id);
}

// columnIds = ["ModelDate", "ModelName", "value"];

var rows = [];
var rowCount = data.rows.length;
for (var i = 0; i < rowCount; i++){
    var row = {}
    for (var j = 0; j< colCount; j++){
        var colId = columnIds[j];
        row[colId] = data.rows[i].c[j].v;
    }
    rows.push(row);
}

model.rows = rows;

Phew, rows are now in a format that we can use.

[
    {
        "ModelDate": "Date(2012, 0, 1, 0, 0, 0)",
        "ModelName": "Buc98",
        "value": 100
    }
] 

Now we've got a reasonable structure. we can actually do the filtering. To do this I'd personally define a function that returns a filtered version of the model so that we can easily unfilter.

function filter(model, prop, value){
    var filteredRows = [];

    var rowCount = model.rows.length;
    for (var i = 0; i < rowCount; i++){
        if (model.rows[i][prop] == value){
            filteredRows.push(model.rows[i]);
        }
    }

    //return a filtered version of the model
    return { 
        cols: model.cols,
        rows: filteredRows
    };
}

You can then use this filtered version to render your table etc.

var filtered = filter(data, 'ModelName', 'Buc98');

Edit - Updated answer so it removes rows that don't match. And added example of use