This is a migrated thread and some comments may be shown as answers.

Combining batch edit and detail template edit on grid

3 Answers 282 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Joe
Top achievements
Rank 2
Joe asked on 16 Nov 2020, 09:47 PM

A client is asking for both batch edit AND a detail/expand edit.

They like the Excel-like editing of batch, but they want several other UI features in the expanded/detail view that don't make sense in a grid row (think charts, hyperlinks, buttons to calculate things, etc.). The idea is that users could use both, even on the same row, then save all grid changes as usually for batch.

I've got it mostly working here: https://jsfiddle.net/joewilson0/jwcLhtg2/

But I have two questions:

  1. Is this a supported way to make edits? Any concerns?
  2. When I change a value in the detail/expand template, the row collapses. How can I prevent that?

3 Answers, 1 is accepted

Sort by
0
Accepted
Georgi Denchev
Telerik team
answered on 18 Nov 2020, 01:46 PM

Hi Joe,

Thank you for the provided code snippet.

Generally speaking editing the values of the master row through a detail row is possible. Examining the sample, everything seems to function properly. As for concerns, I can't think of any at this time. We have a Knowledge Base article dealing with a similar problem without binding the fields. 

The reason the rows are collapsing after you edit them is because the model binder updates the UI in order to display the new values.

The above article takes into consideration this issue, however if you insist on using mvvm there is an alternative method. You can prevent the collapse by Persisting the Expanded Rows. Here is one more example which uses localStorage to save the expanded rows.

Let me know if you have any questions.

Best Regards,
Georgi Denchev
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

0
Joe
Top achievements
Rank 2
answered on 14 Feb 2021, 03:32 AM

Thank you for getting me pointed in the right direction.

I wrote this up as a blog post because it's several steps: https://volaresystems.com/technical-posts/combining-batch-edit-and-detail-template-edit-on-a-kendo-ui-grid

Here's the final working code: https://jsfiddle.net/joewilson0/e3p70jac/2/

0
Georgi Denchev
Telerik team
answered on 16 Feb 2021, 01:59 PM

Hello Joe,

Thank you very much for writing a detailed post explaining your solution and thank you for sharing it with us!

I am certain it would prove helpful to other users who face a similar issue!

Best Regards,
Georgi Denchev
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

Tags
Grid
Asked by
Joe
Top achievements
Rank 2
Answers by
Georgi Denchev
Telerik team
Joe
Top achievements
Rank 2
Share this question
or