Search code examples
asp.net-mvckendo-tabstrip

Kendo tabstrip control - Partial View Button click


I have Kendo tabstrip control on my view, where it has 3 tabs each tab is loaded from partial view. In partial view I have button. When I click the button, only the partial view is displaying the parent view is not displayed after post event.

For quick referenece, the code is below

In Parent view,

 @(Html.Kendo()
    .TabStrip()
    .Name("tabStrip")
    .SelectedIndex(0)
    .Items
    (tabs =>
        {
            tabs.Add().Text("tab1").LoadContentFrom("_Viewtab1", "Controller1", new { id =  Model.Id });
            tabs.Add().Text("tab2").LoadContentFrom("_Viewtab2", "Controller1", new { id = Model.Id });
            tabs.Add().Text("tab3").LoadContentFrom("_Viewtab3", "Controller1", new { Id = Model.Id });
        }
    )
    )

In Referenced View '_Viewtab1',

@model model1 
<div id="ktab1">
 @{ Html.RenderPartial("_PartialView1", Model, new ViewDataDictionary { { "id", Model.Id } });}
</div>

In partial view,

@using (Ajax.BeginForm("_PartialView1", "Controller1",
 new AjaxOptions { UpdateTargetId = "ktab1", OnSuccess = "return jfunction('partialform1', 1);"    },
new { id = Model.Id, id = "partialform1" }))  
{
 <input type="submit" value='Submit' />

}

Solution

  • I fixed the problem by adding the jQuery.unobtrusive-Ajax.js file.