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

Problem using a custom Popup Editor template

3 Answers 1225 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Reid
Top achievements
Rank 2
Reid asked on 16 May 2016, 08:16 PM

I have a custom Edit template working with a grid in that when I show the grid and click the "Edit" button it shows the popup with the data.  I can edit the data and choose the "Update" button and the popup closes.  I can click the "Edit" button again and the popup shows with the modified data.  So far so good.

 

But two things are happening that are not good.  If I click the "Cancel" button I get the following error:

Unhandled exception at line 27, column 1898 in http://localhost:51277/Scripts/kendo/2016.1.18/kendo.all.min.js
0x800a138f - JavaScript runtime error: Unable to get property 'uid' of undefined or null reference

 

Also the data from the Popup is not populating the underlying row visually in the grid.  The popup only has a few of the columns in the grid row but again they remain empty when the popup closes.  When the popup shows again if you again click the "Edit" button the data is in the fields.

 

I have this at the top of the custom editor template which is the unique ID for the row.

@Html.HiddenFor(model => model.strNotificationSubscriptionSeq)

The following code is in place in the Grid markup:

.Editable(editable => editable.Mode(GridEditMode.PopUp).TemplateName("NotificationSubscriptionEditor"))

The Datasource in the grid defines the update method on the controller:

.DataSource(dataSource => dataSource
                      .Ajax()
                      .Model(model => { model.Id(p => p.strNotificationSubscriptionSeq); })
                      .Batch(true)
                      .PageSize(25)
                      .ServerOperation(false)
                      .Events(events => events.Error("error_handler"))
                         .Update("NMSubscriptionUpdate", "NotificationMgr")
                   
                  )

 

One thing to note is that the spec for the main template that contains the grid is to do a batch update for all the rows in grid that are modified.  I have that concept working in other templates which send the JSON to the controller.  All that is working fine but I mention the spec here to state that the controller method does nothing on the backend and just returns the data row item sent into the controller.  When the user clicks the master "Save" button I will post the data to the database.

Here is the controller method:

public ActionResult NMSubscriptionUpdate([DataSourceRequest] DataSourceRequest request,[Bind(Prefix = "models")] GridNotificationSubscriptionDataItem gridNMSubscription)
{
   return Json(gridNMSubscription, JsonRequestBehavior.AllowGet);
}

 

Does someone have a suggestion as to what is going wrong here?  Do I need some JavaScript in the Editor template or the parent main Razor view?

Thanks!

Reid

 

 

 

 

 

 

 

 

 

 

 

 

 

 

3 Answers, 1 is accepted

Sort by
0
Boyan Dimitrov
Telerik team
answered on 18 May 2016, 02:00 PM

Hello Reid,

I am not able to replicate such error with our sample project (please refer to the  Use Custom Popup Editors how-to). Please try to use this project as a base and implement your specific requirements on the top of this project in order to avoid any potential problems. 

I am not sure that I understand how the batch editing functionality will work for your specific case. As soon as the data item is modified (click on the edit button, make the desired changes) the "Update" button should be clicked and the changes will be synced with the server right away. Given this only one data item can be create, modified at a time. 

Regards,
Boyan Dimitrov
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Reid
Top achievements
Rank 2
answered on 29 May 2016, 11:36 AM

I found that the problem was that the MultiSelect editor in the popup markup needed to be named the same as the field or column it is bound to.  I found a post that mentioned this and once I changed it the template worked.

We also decided to abandon the master Save button approach because it seemed to buck the way Telerik was firing events.  All sorts of side effects were occurring with this tactic.  So now the row does the backend update when the user clicks the save button in the popup.  Prior to that, the update method of the controller did nothing but return the row in JSON but the red indicator would never show.

0
Dimiter Topalov
Telerik team
answered on 01 Jun 2016, 07:32 AM
Hello Reid,

I am glad you managed to resolve the issue. If needed, you can find detailed information, and code samples, about creating the editing UI of a Kendo UI Grid for ASP.NET MVC using editor templates:

http://docs.telerik.com/kendo-ui/aspnet-mvc/helpers/grid/templating/editor-templates#editor-templates

Let us know if you have other questions about Kendo UI.

Regards,
Dimiter Topalov
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Tags
Grid
Asked by
Reid
Top achievements
Rank 2
Answers by
Boyan Dimitrov
Telerik team
Reid
Top achievements
Rank 2
Dimiter Topalov
Telerik team
Share this question
or