We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on: November 16, 2018).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

How to integrate other controls with Splitter?

Platform: ASP.NET Web Forms |
Control: Splitter |
Published Date: January 23, 2015 |
Last Revised Date: May 8, 2019 |
Product Version: 12.4.0.24
Tags: splitter

Integrate Splitter with other controls

You can integrate other controls inside the Splitter panels. Validation errors may occur in the ASPX page on adding other controls in SplitPane

On adding Syncfusion controls inside the SplitPane the ASPX page complains saying “Element Unknown” and does not show up any compilation error. To get rid of this validation error in the ASPX page on adding other Syncfusion controls to SplitPane, you have to add the controls under the PaneContent element. PaneContent is defined inside the SplitPane element, to support adding other controls to the Splitter window without any warning or error messages.

ASPX

<ej:Splitter ID="Splitter1" runat="server" Width="850px">
        <ej:SplitPane ID="Split1" PaneSize="400">
            <PaneContent>
               <ej:TreeView ID="treeView" runat="server" Height="300px" Width="300px">
                    <Nodes>
                        <ej:TreeViewNode Text="ASP.NET MVC" Expanded="true">
                            <Nodes>
                                <ej:TreeViewNode Text="Essential Grid"></ej:TreeViewNode>
                                <ej:TreeViewNode Text="Essential Schedule"></ej:TreeViewNode>
                                <ej:TreeViewNode Text="Essential Tools"></ej:TreeViewNode>
                                <ej:TreeViewNode Text="Essential Chart"></ej:TreeViewNode>
                                <ej:TreeViewNode Text="Essential Diagram"></ej:TreeViewNode>
                            </Nodes>
                        </ej:TreeViewNode>
                        <ej:TreeViewNode Text="Silverlight">
                            <Nodes>
                                <ej:TreeViewNode Text="Essential Tools"></ej:TreeViewNode>
                                <ej:TreeViewNode Text="Essential Gauge"></ej:TreeViewNode>
                                <ej:TreeViewNode Text="Essential Chart"></ej:TreeViewNode>
                                <ej:TreeViewNode Text="Essential Grid"></ej:TreeViewNode>
                            </Nodes>
                        </ej:TreeViewNode>
                        <ej:TreeViewNode Text="WPF">
                            <Nodes>
                                <ej:TreeViewNode Text="Essential Grid"></ej:TreeViewNode>
                                <ej:TreeViewNode Text="Essential Schedule"></ej:TreeViewNode>
                                <ej:TreeViewNode Text="Essential Tools"></ej:TreeViewNode>
                                <ej:TreeViewNode Text="Essential Chart"></ej:TreeViewNode>
                                <ej:TreeViewNode Text="Essential Diagram"></ej:TreeViewNode>
                            </Nodes>
                        </ej:TreeViewNode>
                    </Nodes>
                </ej:TreeView>
            </PaneContent>
        </ej:SplitPane>
        <ej:SplitPane ID="split2" PaneSize="200">
            <PaneContent>
                <ej:Tab ID="Tab" runat="server" Width="500">
                    <Items>
                       <ej:TabItem Id="tools" Text="Essential Tools">
                            <ContentSection>
                                Essential Tools is an collection of user interface components used to create interactive ASP.NET MVC applications. Essential Tools can be used to create robust and high performance ASP.NET MVC application interfaces using Editors (including Masked-Edit, Numeric and Percentage text box) and much more.
                            </ContentSection>
                        </ej:TabItem>
                        <ej:TabItem Id="chart" Text="Essential Chart">
                            <ContentSection>
                                Essential Chart is a business-oriented charting component. It offers an innovative data object model that makes it easy to populate the chart with any kind of data source. Essential Chart features an advanced styles architecture that makes complex multi-level formatting very easy.
                            </ContentSection>
                        </ej:TabItem>
                        <ej:TabItem Id="grid" Text="Essential Grid">
                            <ContentSection>
                                Essential Mvc Grid offers full featured a Grid control with extensive support for Grouping and the display of hierarchical data. The Grouping Grid control uses Syncfusion's industry leading Essential Grouping engine to provide a Mvc grid with support for grouping, nested tables and foreign-key relations.Essential Grid also offers a display only cell oriented Grid control for use cases where a ? Windows-Forms like? rich, read only grid UI is desired.
                            </ContentSection>
                        </ej:TabItem>
                    </Items>
                </ej:Tab>
            </PaneContent>
        </ej:SplitPane>
    </ej:Splitter>

Splitter with TreeView and Tab appears as follows.

Splitter with TreeView and Tab

Figure 1: Splitter with TreeView and Tab

2X faster development

The ultimate ASP.NET Web Forms UI toolkit to boost your development speed.
ADD COMMENT
You must log in to leave a comment
Comments
Gyorgy Gorog
May 11, 2018

A C# example, please. Can I add the controls from C#? 

Reply

Please sign in to access our KB

This page will automatically be redirected to the sign-in page in 10 seconds.

Up arrow icon

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon