KendoUI Grid - dataItem.set() method is not working

2 Answers 1085 Views
Grid
dipak
Top achievements
Rank 1
dipak asked on 31 Aug 2018, 07:46 AM

Hi,

I have used kendo grid for display of data, but I am getting an issue in databound event of the grid in dataItem.set() method, here property is not getting set for each row of the grid.

function ondataBound(e){
    var items = grid.items();
    items.each(function (index) {
        var dataItem = grid.dataItem(this);
        if (dataItem) {
            if (dataItem["ActionTaken"] == "Add"){
                if (rowChanges[dataItem.id]) {
                    for (key in rowChanges[dataItem.id]) {
                        dataItem.set(key, rowChanges[dataItem.id][key]);
                    }
                }
            }
        }   
    }
}

Thanks in advance.
Dipak

 

Stefan
Telerik team
commented on 03 Sep 2018, 06:34 AM

Hello, Dipak,

Thank you for the code.

I made an example using a similar approach and the set method is working as expected:

https://dojo.telerik.com/eWEruGuB

Could you please set a debugger just before the set method is called to ensure that all of the checks are successful and the values for "key" and "rowChanges[dataItem.id][key]" are as expected.

If the issue continues, please share an example with us, as the issue could be caused by part of the code which we are overlooking at this point.

Regards,
Stefan
Progress Telerik
Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
dipak
Top achievements
Rank 1
commented on 03 Sep 2018, 12:33 PM

Hi Stefan,

Thanks for you reply, I would like include with my posted question, when gridcopyrow() event is called to copy entire row, and insert the same copied row as a new row in the grid. Here databound() event is getting called and dataItem.set() method is getting executed, but property is not getting set for the copied row. Please suggest, how to resolve this issue.

function gridCopyRow(grid, row) {
var gridId = getGridId(grid);
var dataItem = grid.dataItem($(row));
grid.dataSource.insert(0, dataItem.toJSON());
var newrow = grid.tbody.find('tr:first');
grid.select(newrow);
var newDataItem = grid.dataItem(grid.select());
newDataItem.ActionTaken = "Add";
grid.editRow(newrow);
}
 
function ondataBound(e){
var items = grid.items();
items.each(function (index) {
var dataItem = grid.dataItem(this);
if (dataItem) {
if (dataItem["ActionTaken"] == "Add"){
if (rowChanges[dataItem.id]) {
for (key in rowChanges[dataItem.id]) {
dataItem.set(key, rowChanges[dataItem.id][key]);
}}}}}
 
@(Html.Kendo().Grid<Test.Model.School>()
.Name("grid_Test")
.Columns(columns =>
{
    foreach (System.Data.DataColumn column in Model.Columns)
    {
        switch (column.ColumnName)
        {
            case "Marks":
            var c = columns.Bound(column.ColumnName)
           .Title(column.Caption);
             break;
 
           default:
           c = columns.Bound(column.ColumnName)
           .Title(column.Caption);
            break;
       }
    }
})
.DataSource(dataSource => dataSource
.Ajax()
.Events(events => events
.Model(model =>
{
  model.Id(p => p.PRIMARY_KEY);
  foreach (System.Data.DataColumn column in Model.Columns)
   {
     var field = model.Field(column.ColumnName, column.DataType);
    }
})
.Events(events => events
.DataBound("onDataBound")
.BeforeEdit("onBeforeEdit")
.CellClose("onCellClose")
.Edit("onEdit")
)

 

Thanks,

Dipak

Dmitry
Top achievements
Rank 2
commented on 25 Oct 2018, 09:23 AM

Hi,

I have an issue with dataItem.Set too.

The same code, what has worked on 2018.1.221 doesn't work with 2018.3.1017 anymore:

It looks like this:

            var cnt=0;
            grid.table.find(".chkSelect").each(function () {
                var dataItem = grid.dataItem($(this).closest('tr'));
                if (dataItem && dataItem.StudySiteId == dataRow.StudySiteId) {
                    ++cnt;
                    var checkedSelected = $(this).is(':checked');
                    if (checkedSelected != bulkCheck) {
                        dataItem.set(this.name, bulkCheck);
                        //dataItem.IsSelected=bulkCheck;
                        $(this).prop("checked", bulkCheck);
                    }
                }
            })

After the first call of dataItem.set(this.name, bulkCheck) in the loop
function grid.dataItem($(this).closest('tr')) returns null value.

I suppose, dataItem.set has a bug now and destroys something in the  dataSource model.

Now it's a question wheather I'll open support ticket (need more time for the simple test project) or there is a some workaround.

BigzampanoXXl
Top achievements
Rank 1
commented on 29 Oct 2018, 10:07 AM

Hi,

I have exactly the same problem. dataItem.set() doesn't work with 2018.3.1017 anymore. I hope there will be a fix soon.

Best regards!

2 Answers, 1 is accepted

Sort by
0
Stefan
Telerik team
answered on 04 Sep 2018, 07:03 AM
Hello, Dipak,

Thank you for the additional code.

I added it to the example to utilize the row copy function, but the expected value is still set.

https://dojo.telerik.com/eWEruGuB/2

Please use the debugger to observe if there is the difference in the values of the real application and the Dojo example.

I do understand that sharing an example is not an easy task, but it can prove helpful in resolving complex issues like this one.

Regards,
Stefan
Progress Telerik
Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
0
Konstantin Dikov
Telerik team
answered on 29 Oct 2018, 10:33 AM
Hello Dmitry,

Could you please share a dojo example demonstrating the scenario that was working with the older version? The "set" method of the data items triggers the "change" event of the dataSource, which in most cases forces the Grid to render its data content again, but with different uid`s and respectfully, different TR elements. To update multiple records you will have to set the value directly, without using the "set" method and set its "dirty" property to true:
if (checkedSelected != bulkCheck) {
                       dataItem.IsSelected=bulkCheck;
                       dataItem.dirty = true;
                       $(this).prop("checked", bulkCheck);
}

Looking forward to your reply with the example that was working with the old version.


Regards,
Konstantin Dikov
Progress Telerik
Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Dmitry
Top achievements
Rank 2
commented on 29 Oct 2018, 11:46 AM

Hello Konstantin,

I've alread opened a Ticket (Id 1348144) and got the answer, what in the 18'Q3 Version was corrected the old mistake: "change event doesn't fire in the grouped grid after dataItem.set()"

Angel Petrov has recomended to detache _refreshHandler temporary and attach after set() operation again.
I've tried your idea two years ago, but it didn't work (Update methode of the controller didn't get any datarow).

I'll try it again.

Tags
Grid
Asked by
dipak
Top achievements
Rank 1
Answers by
Stefan
Telerik team
Konstantin Dikov
Telerik team
Share this question
or