Data Source with list property in model, update not triggering

[Eric Kuijpers]

Given a model that looks like :

public class TempPart
    {
        public int DealerProductId { get; set; }
        public string SupplierCode { get; set; }
        public string Supplier { get; set; }
        public string ProductNumber { get; set; }
        public List<string> AlternativePartNumbers { get; set; }
    }

I render a grid. Each row has a client template containing a tabstrip. One of these tabstrips contains a list of inputs that are used to display and update the "AlternativePartNumbers" above. A button on this tabstrip controls updating the datasource with the changed values, using the following javascript :

function updateAltNumbers(e) {
           var id = $(e).closest("div").find("input[name='dpId']").val();
           var dataItem = $('#partsGrid').data('kendoGrid').dataSource.get(id);
           var dataItemColumn = dataItem.get("AlternativePartNumbers");
           var i = 0;
          $('#AltNumbersList_' + id).find('input').each(function (e) {
               dataItemColumn[i++] = $(this).val();
           });
           dataItemColumn.length = i;
           dataItem.set("AlternativePartNumbers", dataItemColumn);
          $('#partsGrid').data('kendoGrid').dataSource.sync();
       }

In the javascript debugger I can see that the dataItem is being updated, the array of strings is filled and added to the datasource. However, the sync method does not trigger the dataSource.Update. If I add an arbitrary field to this model and update that field before the sync as well, everything works fine and the updated record is submitted succesfully to the underlying controller :

public bool Update { get; set; }

dataItem.set("AlternativePartNumbers", dataItemColumn);
dataItem.set("Update", true);
$('#partsGrid').data('kendoGrid').dataSource.sync();

Any ideas on how to correct this behavior?

ic bool Update { get; set; }

dataItem.set("AlternativePartNumbers", dataItemColumn);
dataItem.set("Update", true);
$('#partsGrid').data('kendoGrid').dataSource.sync();

l

[Daniel]

Hello Eric,

The set method will not update the dirty flag because the value is the same as the current value in the model:

var dataItemColumn = dataItem.get("AlternativePartNumbers");
...
dataItem.set("AlternativePartNumbers", dataItemColumn);

You could either manually set the dirty field:

dataItemColumn.length = i;
dataItem.dirty = true;
$('#partsGrid').data('kendoGrid').dataSource.sync();

or set a new array instance:

var dataItemColumn = [];
var i = 0;
$('#AltNumbersList_' + id).find('input').each(function (e) {
    dataItemColumn[i++] = $(this).val();
});
dataItem.set("AlternativePartNumbers", dataItemColumn);

Regards,
Daniel
Telerik