Need access Kendo Grid data row wise.

[dipak]

I have used Kendo Grid in my project, i need access values in each row, row wise. And need to compare the values between two columns. 

For example:-

 Student ID     Student Name  Student Physics StudentChemistry

   1                       xx                       44                         33

   2                        yy                        55                         66

The marks between two columns is required to be compared, and have to highlight the cell which contain less value.

Any row wise data iteration example would be helpful.

Thanks in advance.

Dipak

 

[Georgi]

Hello Dipak,

Based on the provided information I assume that the requirement is to highlight the value of the cell which value is smaller. Please correct me if I am wrong.

A possible solution is to use a column.template and within that template check which value is less than the other and highlight it.

For your convenience bellow you will find a small sample which demonstrates the above approach:

• https://dojo.telerik.com/UWimuWIx

Regards,
Georgi
Progress Telerik

[dipak]

Thanks Georgi, for your response. Yes i was looking for similar thing, but wanted to do this using JQuery script, so that i can have flexibility to access grid values at runtime. 

Thanks.

Dipak

[dipak]

Thanks Georgi, for your reply. Yes, i was looking for some thing similar like this. But looking for JQuery script which will perform the iteration on an event and additionally it would be helpful to access data in the Grid in run time.

Thanks,

Dipak

[Georgi]

Hello Dipak,

So basically the requirement is to iterate through the rows, compare the values of each item and highlight the column which contains smaller value. Correct me if I am wrong.

I have created a function which accepts a grid and names of the columns that should be compared:

function compareFields(grid, firstField, secondField) {
    grid.tbody.find('tr').each(function () {
        var dataItem = grid.dataItem($(this));

        if (dataItem[firstField] > dataItem[secondField]) {
            var columnIndex = grid.columns.map(x => x.field).indexOf(secondField);

            $(this).find('td:eq(' + columnIndex + ')').css('background-color', 'yellow');
        } else {
            var columnIndex = grid.columns.map(x => x.field).indexOf(firstField);

            $(this).find('td:eq(' + columnIndex + ')').css('background-color', 'yellow');
        }
    })
}

Below you will find a small sample which uses the above function:

• http://dojo.telerik.com/uCEzoVAX

Regards,
Georgi
Progress Telerik

[dipak]

Thanks Georgi, yes i was looking for similar implementation. Thanks a lot.