Auto-Resizing to Window
You can add a Splitter that resizes automatically along with the Kendo UI for jQuery Window widget.
@(Html.Kendo().Window()
.Name("window")
.Title("Telerik UI Window")
.Resizable()
.Modal(true)
.Width(400)
.Height(250)
.Draggable(true)
)
<script id="template" type="text/x-kendo-template">
@(Html.Kendo().Splitter()
.Name("splitter")
.Orientation(SplitterOrientation.Horizontal)
.Panes(verticalPane =>
{
verticalPane.Add().Collapsible(true).Content("left pane <br /><br /> Please resize the Window and watch the Splitter resize automatically.");
verticalPane.Add().Collapsible(true).Content("right pane");
})
.ToClientTemplate()
)
</script>
<script>
$(function () {
var template = kendo.template($("#template").html());
$("#window").append(template({}));
$("#window").data("kendoWindow").center();
})
</script>
<style>
html {
font: 12px sans-serif;
}
#splitter {
border-width: 0;
height: 100%;
}
#window {
padding: 0;
overflow: hidden;
}
</style>
public class SplitterController : Controller
{
public ActionResult Index()
{
return View();
}
}