Custom data validation in grid popup editor

[Shane]

I'm trying to figure out how to have one of my fields data validated through my controller on a popup edit via the grid by GridEditMode.Popup.

Here's how my grid is set up:

 

@(Html.Kendo().Grid(Model)
.Name("areasGrid")
.Columns(c =>
{
    c.Bound(p => p.Id).Title("ID").Visible(false);
    c.Bound(p => p.AreaName).Title("Area");
    c.Bound(p => p.SupervisorPic).Title("User").Visible(false);
    c.Bound(p => p.SupervisorName).Title("Supervisor");
    c.Command(command => { command.Edit(); command.Destroy(); }).Width(170);
})
.AllowCopy(true)
.Selectable()
.DataSource(dataSource => dataSource
    .Ajax()
    .ServerOperation(false)
    .Model(model =>
    {
        model.Id(p => p.Id);
    })
    .PageSize(30)
    .Events(events => events.Error("error_handler"))
    .Create(update => update.Action("EditingPopup_Create", "ProgramAssignment"))
    .Read(read => read.Action("EditingPopup_Read", "ProgramAssignment"))
    .Update(update => update.Action("EditingPopup_Update", "ProgramAssignment"))
    .Destroy(update => update.Action("EditingPopup_Destroy", "ProgramAssignment"))
)
.Sortable()
.Filterable()
.ToolBar(toolbar =>
{
    toolbar.Create();
})
.Editable(editable => editable.Mode(GridEditMode.PopUp).TemplateName("Area").Window(w => w.Width(400)).CreateAt(GridInsertRowPosition.Bottom))
.Pageable(p => p.PageSizes(new int[] { 10, 20, 30, 50 }))
.Resizable(resize => resize.Columns(false))
.ColumnMenu()
)

And here's my template where users can add/edit records that's used by the grid's editable template name:

@model Voice.ViewModels.AreaViewModel

<link href="~/Content/kendo/2015.3.1111/kendo.blueopal.min.css" rel="stylesheet" type="text/css" />
@(Html.Kendo().TextBoxFor(model => model.Id)
    .Name("Id")
    .HtmlAttributes(
        new
        {
            @style = "display:none"
        }
    )
)
<table>
    <tr>
        <td>
            <label>Area</label>
        </td>
        <td>
            @(Html.Kendo().TextBoxFor(model => model.AreaName)
                .Name("AreaName")
                .HtmlAttributes(
                    new
                    {
                        @style = "width: 255px",
                        @placeholder = "Area Name",
                        @id = "AreaName",
                        @class = "k-textbox",
                        @required = "required",
                        @validationmessage = "Enter area name.",
                        @maxlength = "255"
                    }
                )
            )
        </td>
    </tr>
    <tr>
        <td>
            <label>Supervisor</label>
        </td>
        <td>
            @(Html.Kendo().TextBoxFor(model => model.SupervisorPic)
                .Name("SupervisorPic")
                .HtmlAttributes(
                    new
                    {
                        @style = "width: 255px",
                        @placeholder = "Supervisor PIC",
                        @id = "SupervisorPic",
                        @class = "k-textbox",
                        @required = "required",
                        @validationmessage = "Enter the PIC code of the supervisor.",
                        @maxlength = "3"
                    }
                )
            )
        </td>
    </tr>
</table>

Ideally, I'd like to be able to validate the SupervisorPic field (basically someone's user ID at my work) by calling a method in my controller to validate the entry against our security system.  Is this possible?

[Vasil]

Hi Shane,

I would suggest you to look the flowing resources and discussions about the same topic:
http://www.telerik.com/blogs/handling-server-side-validation-errors-in-your-kendo-ui-grid
http://www.telerik.com/support/code-library/handling-server-side-validation-errors-during-pop-up-editing
http://www.telerik.com/forums/validation-on-edit-popup-window-of-kendoui-grid-with-editor-templates

Regards,
Vasil
Telerik