Navigation and Layout - Splitter Overview

Left container
Right container
About the Splitter

The DevExpress ASP.NET MVC Splitter extension gives you the ability to split a web application screen into multiple sections or panels and optionally allow end-users to resize panels as their needs dictate.

To add two resizable panes to your page, add the Splitter to the View and add two panes to the Splitter.

View code:

@Html.DevExpress().Splitter(settings => {
    settings.Name = "splOverview";
    settings.Panes.Add(pane => {
        pane.SetContent(() => {
                "<div>Left container</div>"
    settings.Panes.Add(pane => {
        pane.SetContent(() => {
                "<div>Right container</div>"

Splitter allows you to define the content of any of its panes.

Key Features
  • Resizing
    The Splitter extension allows you to create sizable webpage content by embedding it into splitter panes.
  • Min and Max Size
    The Splitter extension allows you to set the maximum and minimum size of its panes.
  • Collapse and Expand
    The Splitter extension allows you to expand or collapse its panes. When the splitter pane is collapsed, it allows other pane content to be expanded for more convenience.
  • Rich Client-Side Functionality
    A comprehensive client-side API is available for Splitter. This functionality, coupled with the ability to handle events on the client side, gives you full control over the splitter behavior on the client side.
  • Content URL
    Splitter allows you to display external web pages as the content of splitter panes.
Version: v2017 vol 1.6
Copyright © 2006-2017 Developer Express Inc
Your Next Great MVC App Starts Here

Get started today and download your 30-day trial of DevExpress MVC Extensions (includes 30 days of free technical support).

All demos ship with full source code and are included in the DevExpress MVC distribution. Refer to the Demos and Sample Applications topic to learn more.

DevExpress MVC Extensions ship as part of DevExpress Universal, DXperience and ASP.NET Subscriptions and are backed by a 60 day unconditional money-back guarantee.
To learn more and obtain pricing information, visit the Compare Features and Pricing webpage. For immediate assistance, contact us by Email at or by phone at +1 (818) 844-3383 between 7:30am and 4:30pm Pacific Time.