binding collection of items in the popup editor

[junior]

I am using kendo grid popup editor with a template.

.Editable(c => { c.TemplateName("_CustomTemplate").Mode(GridEditMode.PopUp); })

This is the _CustomTemplate i am using

@model Models.CustomViewModel
<div id="popupeditor">
    @Html.HiddenFor(model => model.Id)
    <button type="button" id="NewEmailButton">Add New Email</button>
</div>

And the template model is

public class CustomViewModel 
{
    public string Name { get; set; }
    public List<string> EmailList { get; set; } = new List<string>();
}

User can add new input for email by clicking the "Add New Email" button. I am adding the input to PopUp container with javascript.

function AddEmail() 
{
    let index = 0;
    let input = '<input name="EmailList[index]" type="text"/>'
    $(input).appendTo('#popupeditor');
}

The problem is when i click save on the popup editor it doesn't bind to my model. It doesn't even go to my save method. If i edit the Name it goes to the Save method but Emails list stays empty.

[Stoyan]

Hello,

The custom template available for the Grid's PopUp Editing is not a Partial View but a regular View located in the Views/Shared/EditorTemplates directory. It is then serialized to Html and becomes a part of the Grid Component's serialization rendered on the client-side.

For this reason using a Partial View as a PopUp or passing a Model to the PopUp's Template is not supported.

To workaround that you can pass weakly typed data like ViewBag or ViewData to the View containing the Grid to make it available in the CustomTemplate.

Alternatively, create a Custom PopUp with the use of the Window Component. The Window Component can implement Partial Views as its content. However in such a case you'd need to handle the change of the Grid's DataItems manually with the use of the Model API's set method.

For your convenience I have applied a sample project that showcases аn approach similar to the latter.

I hope the information above is useful. Please don't hesitate to let me know should further questions arise.

Regards,
Stoyan
Progress Telerik