Validation in hierarchical Grid

[Anton.S]

Hi!

I've got a small MVC application with hierarchical Kendo UI MVC Grid in it. Here is the code for the main grid.

01.Html.Kendo().Grid<PurchaseStageViewModel>()
02. .Name("purchaseStagesGrid")
03. .ToolBar(toolbar =>
04. {
05.     if (!Model.ReadOnly)
06.     {
07.         toolbar.Create();
08.     }
09. })
10. .Editable(e => e.Mode(GridEditMode.InLine).CreateAt(GridInsertRowPosition.Bottom))
11. .Resizable(resize => resize.Columns(true))
12. .Columns(c => {
13.     c.Bound(s => s.Name);
14.     c.Bound(s => s.StartDate).Format("{0:dd.MM.yyyy}");
15.     c.Bound(s => s.EndDate).Format("{0:dd.MM.yyyy}");
16. })
17. .DataSource(d => d.Ajax().
18. Model(m =>
19. {
20.     m.Id(p => p.Id);
21. })
22. .Read(a => a.Action("GetStages","PurchaseStage"))
23. .Create(a => a.Action("CreateStage", "PurchaseStage"))
24. .Update(a => a.Action("UpdateStage","PurchaseStage"))
25. .Destroy(a => a.Action("DeleteStage", "PurchaseStage"))
26. )
27. .ClientDetailTemplateId("childStagesTemplate")

And this code is for details.

01.<script id="childStagesTemplate" type="text/kendo-tmpl">
02.    @(
03.    Html.Kendo().Grid<purchaseStageViewModel>()
04.    .Name("grid_#=Id#")
05.    .TableHtmlAttributes(new {@class ="k-grid-nested" })
06.    .ToolBar(toolbar =>
07.    {
08.        toolbar.Create());
09.    })
10.    .Editable(e => e.Mode(GridEditMode.InLine).CreateAt(GridInsertRowPosition.Bottom))
11.    .Resizable(resize => resize.Columns(true))
12.    .Columns(c =>
13.    {
14.        c.Bound(s => s.Name);
15.        c.Bound(s => s.StartDate).Format("{0:dd.MM.yyyy}");
16.        c.Bound(s => s.EndDate).Format("{0:dd.MM.yyyy}");
17.        c.Command(command =>
18.            {
19.                command.Edit();
20.                command.Destroy();
21.            });
22.    })
23.    .DataSource(d => d.Ajax().
24.    Model(m =>
25.    {
26.        m.Id(p => p.Id);
27.        m.Field(p => p.Id).DefaultValue(default(long));
28.        m.Field(p => p.ParentStageId).DefaultValue("#=Id#"); //ParentStageId - is a string type
29.    })
30.    .Read(a => a.Action("GetNestedStages", "PurchaseStage", new { parentStageId = "#=Id#" }))
31.    .Create(a => a.Action("CreateStage", "PurchaseStage",new { parentStageId = "#=Id#" }))
32.    .Update(a => a.Action("UpdateStage", "PurchaseStage"))
33.    .Destroy(a => a.Action("DeleteStage", "PurchaseStage"))
34.    )
35.    .ClientDetailTemplateId("testTemplate")
36.    .ToClientTemplate()
37.    )
38.</script>

Actualy this grid appears to be recursive, so each detail contains it's own details grid. For DateTime fields I use Kendo DatePicker. 

So each row has StartDate and EndDate. I need to implement validation in all nested grids so the StartDate and EndDate properties of nested grids could be selected only in StartDate  and EndDate range of parent row. Is there any way to implement it?

[Daniel]

Hello,

You can implement a custom validation rule using the approach demonstrated in this documentation topic. In order to find the parent row start and end values you can search for the parent row and grid relative to the input or validator element e.g.

myrule: function (input) {
    if (input.is("[data-val-myrule]") && input.val() != "") {
        var masterRow = this.element.closest(".k-detail-row").prev();
        var masterGrid = masterRow.closest("[data-role=grid]").getKendoGrid();
        var masterModel = masterGrid.dataItem(masterRow);
        var startdate = masterModel.StartDate;
        var endDate = masterModel.EndDate;
        ...

Regards,
Daniel
Telerik by Progress