Kendo UI Grid Tabstrip - How to view details in 2nd tabs with custom button

Question

I had this demo here that contains tab1 and tab2. What I want to achieve when clicked on custom button "View Details", data's on selected row will display is tab2. Anyone can help me how to achieve this? Thanks in advance.

demo in dojo

Answer 1

Hopefully this is what you are after: https://dojo.telerik.com/iRobiSAw/2

All I have done is obtained the dataItem for the row selected and then bound this to a new ObservableObject to the second tab.

 var vm = new kendo.data.ObservableObject( this.dataItem($(e.currentTarget).closest("tr")));
   //Added console log just to show the object has been obtained. 
  console.log(vm); 

  kendo.bind($('#grid2'), vm); 

I haven't wired up the save button so the data doesn't persist back to the original datasource but I am sure this would be doing a save back to the server where you would be refreshing the datasource that sits under the first grid.