Search code examples
asp.net-mvc-5kendo-gridkendo-asp.net-mvckendo-contextmenu

Calling a view on click of the kendo context menu in MVC5


I am have implemented a kendo context menu and grid on my MVC 5 page. I need to navigate to another page on click of edit by passing the requestid to it. When I try to call the @{Html.RenderAction("NewRequest_Read", "Request");} it loads the view upfront along with view contains the context menu. Could somebody tell me how do I go about it

Context Menu

 @(Html.Kendo().ContextMenu()
        .Name("RequestMenu")
        .Target("#GridRequest")
        .Filter("tr")
        .Orientation(ContextMenuOrientation.Vertical)
        .Animation(animation =>
        {
            animation.Open(open =>
            {
                open.Fade(FadeDirection.In);
                open.Duration(500);
            });
        })
         .Items(items =>
         {
             items.Add()
                 .Text("Edit");

             items.Add()
                  .Text("Cancel");
         })

         .Events(e =>
         {
             e.Select("onSelect");

         })
    )

Script

function onSelect(e) {
    var grid = $("#GridTeam").data("kendoGrid");


    switch ($(e.item).children(".k-link").text()) {

        case "Edit":
            @{Html.RenderAction("NewRequest_Read", "Request");}

            break;
        case "Cancel":
            grid.removeRow(e.target);
            break;
    }
}

Controller method

  public ActionResult NewRequest_Read(string id)
        {
            NewRequestViewModel newReqeustViewModel = new NewRequestViewModel();
            return View("NewRequestView", newReqeustViewModel);
        }

Solution

  • function onSelect(e) {
    var grid = $("#GridTeam").data("kendoGrid");
    
    switch ($(e.item).children(".k-link").text()) {
        case "Edit":
            window.location.href = '@Url.Action("NewRequest_Read", "Request", new { id = //add request id parameter here })';
            break;
        case "Cancel":
            grid.removeRow(e.target);
            break;
    }
    

    }