Problem using a custom Popup Editor template

4 posts, 0 answers
  1. Reid
    Reid avatar
    448 posts
    Member since:
    Oct 2008

    Posted 16 May 2016 Link to this post

    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

     

     

     

     

     

     

     

     

     

     

     

     

     

     

  2. Boyan Dimitrov
    Admin
    Boyan Dimitrov avatar
    2062 posts

    Posted 18 May 2016 Link to this post

    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!
     
  3. Reid
    Reid avatar
    448 posts
    Member since:
    Oct 2008

    Posted 29 May 2016 in reply to Boyan Dimitrov Link to this post

    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.

  4. Dimiter Topalov
    Admin
    Dimiter Topalov avatar
    1285 posts

    Posted 31 May 2016 Link to this post

    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!
Back to Top