I'm trying to make a kendo grid using sortable and inline editing. I found whenever you make the grid sortable there are some issues that happen with inline editing. Whenever you click on the edit button, you can't click into the input fields to edit. The only way you can edit those fields is if you tab over to them. Also, whenever you change certain inputs they won't save.
I've created a dojo to show my issues: http://dojo.telerik.com/uYidA
Just click edit on any row and see that you can't click into the inputs. Also, click edit and try to change one of the inputs and see that it doesn't save correctly.
Thanks in advance!
6 Answers, 1 is accepted
The described undesired behavior is caused by the fact that the Sortable functionality necessitates the corresponding events for enabling reordering of the rows to come after the ones, required for the proper editing functionality.
There most straight-forward approach is to modify the Sortable filter to exclude rows in editing mode:
...filter: ">tbody >tr:not('.k-grid-edit-row')"...http://dojo.telerik.com/uYidA/2
I hope this helps.
Regards,
Dimiter Topalov
Telerik by Progress
Rank 1
Hello Dimiter,
Thanks for the response, it looks like it's working correctly now.
I found another issue though, now whenever you sort the table and then try to edit a row, the destroy function also gets called on the row that you moved to sort. I've seen this issue before, and I believe the fix before was to return something back from your ajax calls but this seems to not work for this issue.
Let me know what you think
I could not reproduce the described issue in the provided example. When a row is reordered, and the Delete button is pressed for either the row we have been dragging, or for the one that was previously in the new position of the dragged row, only the item, corresponding to the row, in which the Delete button was pressed is removed.
Can you please describe in further details the steps that need to be performed in order to observe the undesired behavior?
Thank you in advance.
Regards,
Dimiter Topalov
Telerik by Progress
Rank 1
Hello Dimiter,
Yes, it looks like that it will work if you sort and then hit the delete button, but if you try to sort and then update/edit a row you can see whenever you hit update in the network tab that the destroy function is called. And if you reload the page you will see that the rows that you sorted before updating another row are now deleted.
So to test this: sort anything, then click edit on one row and change the name or something, then click update (if you have the network tab open you can see that the destroy method is called), then reload the page and see that the row/rows that you sorted are now deleted.
Let me know if that makes sense
Thank you for explaining the issue. I was able to reproduce it. It is caused by the fact that for the purpose of the reordering, the dragged item has to be destroyed, recreated, and inserted in the new place.
However, in the discussed example, the dataSource.remove() method is used. If we use pushDestroy() instead, the scenario seems to be working as expected:
http://dojo.telerik.com/uYidA/4
I hope this helps.
Regards,
Dimiter Topalov
Telerik by Progress
Rank 1