Grid Inline Editing - New Row Is Not Displayed

Posted by jts-law on 18-Sep-2017 09:44

Hello all,

I have a grid with the Edit Mode set to Inline.  When I click the New button, the new row is not displayed, nothing visual happens on the page.  I believe a new row is being created (within the DataSource/Model) because if I refresh the page or grid I get an Ok/Cancel popup regarding "unsaved changes".  The Edit button works correctly and I was expecting the New button to work the same way.

I've also setup a Row Create Event function on the grid as well as binding an "edit" function to the grid and neither are executing when I click the New button.

I'm currently using KUIB version 2.0.0.87.

Louis

Posted by jts-law on 20-Sep-2017 10:14

All,

I figured out my issue.  I'm not creating a new data source, the original created by KUIB works fine.  I setup a data source change event function to set the field correctly.  Previously I was setting the value being filtered on using "e.item[].report = filter.filters[0].value", this needs to be done with a model.set().

The following code works correctly.

               this.$ds.dsMyDataSourcet.bind("change",(e) => {

                   if (e.action === "add") {

                       let gridTotals = angular.element("#gridMain").data("kendoGrid"),

                           filter = gridTotals.dataSource.filter();

                       if (filter && filter.filters[0].field === "report") {

                           let modelNew = e.sender.getByUid(e.items[0].uid);

                           modelNew.set("report", filter.filters[0].value);

                       }

                   }

               });

Louis

Posted by jts-law on 20-Sep-2017 11:03

All,

I figured out my issue.  I'm not creating a new data source, the original created by KUIB works fine.  I setup a data source change event function to set the field correctly.  Previously I was setting the value being filtered on using "e.item[].report = filter.filters[0].value", this needs to be done with a model.set().

The following code works correctly.

this.$ds.dsMyDataSourcet.bind("change",(e) => {

   if (e.action === "add") {

       let gridTotals = angular.element("#gridMain").data("kendoGrid"),

           filter = gridTotals.dataSource.filter();

       if (filter && filter.filters[0].field === "report") {

           let modelNew = e.sender.getByUid(e.items[0].uid);

           modelNew.set("report", filter.filters[0].value);

       }

   }

});

Louis

Posted by jts-law on 20-Sep-2017 11:06

All,

I figured out my issue.  I'm not creating a new data source, the original created by KUIB works fine.  I setup a data source change event function to set the field correctly.  Previously I was setting the value being filtered on using "e.item[].report = filter.filters[0].value", this needs to be done with a model.set().

The following code works correctly.

this.$ds.dsMyDataSourcet.bind("change",(e) => {

   if (e.action === "add") {

       let gridTotals = angular.element("#gridMain").data("kendoGrid"),

           filter = gridTotals.dataSource.filter();

       if (filter && filter.filters[0].field === "report") {

           let modelNew = e.sender.getByUid(e.items[0].uid);

           modelNew.set("report", filter.filters[0].value);

       }

   }

});

Louis

[ Sorry for the duplicates, the forum is sending the email but not saving the response to the thread. ]

All Replies

Posted by jts-law on 18-Sep-2017 11:35

All,

After some more web searching I believe the issue is being caused by the filter on the data source.  The solution is to set a default value on the field being filtered.  The data source is being created in the controller.js (which I can't modify) and the schema is coming from the transport URL (REST).  If possible I'd like to be able to add the default value logic to the existing data source schema field without having to create a new data source.  Does anybody know how I can add a default value to field of an existing data source?

References found:

www.telerik.com/.../unable-to-add-row-when-filtering

http://dojo.telerik.com/OhUPo

Louis

Posted by jts-law on 19-Sep-2017 12:15

All,

I was able to create a new data source and set it on my grid using setDataSource.  When I do this, the defaultValue function is called when the object is created and that's the only time, it isn't called when the Add button is clicked.

I've also tried setting the field being filtered on to the filter value in the "change" event on the data source.  I can see that the record has the correct value to match the filter but it still isn't displayed.

If I don't filter the data source, the Add button works.  This is not the fix I need though.

There has to be a way to do this, and I'm sure somebody else will need to know this in the future. Does anybody have any thoughts on how to handle adding a new row to a grid when the data source is filtered and the grid edit mode is "inline"?

Posted by jts-law on 20-Sep-2017 10:14

All,

I figured out my issue.  I'm not creating a new data source, the original created by KUIB works fine.  I setup a data source change event function to set the field correctly.  Previously I was setting the value being filtered on using "e.item[].report = filter.filters[0].value", this needs to be done with a model.set().

The following code works correctly.

               this.$ds.dsMyDataSourcet.bind("change",(e) => {

                   if (e.action === "add") {

                       let gridTotals = angular.element("#gridMain").data("kendoGrid"),

                           filter = gridTotals.dataSource.filter();

                       if (filter && filter.filters[0].field === "report") {

                           let modelNew = e.sender.getByUid(e.items[0].uid);

                           modelNew.set("report", filter.filters[0].value);

                       }

                   }

               });

Louis

Posted by jts-law on 20-Sep-2017 11:03

All,

I figured out my issue.  I'm not creating a new data source, the original created by KUIB works fine.  I setup a data source change event function to set the field correctly.  Previously I was setting the value being filtered on using "e.item[].report = filter.filters[0].value", this needs to be done with a model.set().

The following code works correctly.

this.$ds.dsMyDataSourcet.bind("change",(e) => {

   if (e.action === "add") {

       let gridTotals = angular.element("#gridMain").data("kendoGrid"),

           filter = gridTotals.dataSource.filter();

       if (filter && filter.filters[0].field === "report") {

           let modelNew = e.sender.getByUid(e.items[0].uid);

           modelNew.set("report", filter.filters[0].value);

       }

   }

});

Louis

Posted by jts-law on 20-Sep-2017 11:06

All,

I figured out my issue.  I'm not creating a new data source, the original created by KUIB works fine.  I setup a data source change event function to set the field correctly.  Previously I was setting the value being filtered on using "e.item[].report = filter.filters[0].value", this needs to be done with a model.set().

The following code works correctly.

this.$ds.dsMyDataSourcet.bind("change",(e) => {

   if (e.action === "add") {

       let gridTotals = angular.element("#gridMain").data("kendoGrid"),

           filter = gridTotals.dataSource.filter();

       if (filter && filter.filters[0].field === "report") {

           let modelNew = e.sender.getByUid(e.items[0].uid);

           modelNew.set("report", filter.filters[0].value);

       }

   }

});

Louis

[ Sorry for the duplicates, the forum is sending the email but not saving the response to the thread. ]

This thread is closed