Splitter Panel Width and Height.

Sep 16, 2009 at 7:14 PM

Hi

I am trying to use the splitter panel and the page has masterPage. However the splitter panel is overlapping on the masterpage.  What should I do to make sure splitter panel stay inside the ContentPlaceHolder? Below is my code of using Splitter Panel;

 

<%@ Page Language="C#" MasterPageFile="~/MainMasterPage.master" AutoEventWireup="true"
    CodeFile="DetailView.aspx.cs" Inherits="DetailView" Title="DetailPage" %>

<%@ Register Assembly="SCS.Web.UI.WebControls.SplitterPanel" Namespace="SCS.Web.UI.WebControls"
    TagPrefix="cc1" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="Server">
    <link href="CSS/SplitterPanel.css" rel="stylesheet" type="text/css" />
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">
    <div>
        <cc1:SplitterPanel ID="SplitterPanel1" runat="server" LeftPanePixelWidth="350" ToolTip="Drag divider left or right to resize panes. Press 't' to toggle on and off left pane."
            BehaviorId="splitter" TopPosition="300px" CssClass="splitter" >
            <DividerStyle CssClass="dividerStyle" />
            <LeftPane>
                Need some sample content do test the left pane scollbars. Let&#39;s count to 40
                vertically...<br />
            </LeftPane>
            <RightPane>
                <asp:Button ID="Poster" runat="server" Text="Postback" /><br />
                <br />
                <div style="float: right" id="resizeMsg">
                </div>
                Need some sample content do test the right pane scollbars. Let's count again to
                40 vertically...<br />
                <br />
            </RightPane>
            <RightPaneStyle CssClass="rightPane" />
            <LeftPaneStyle CssClass="leftPane" />
        </cc1:SplitterPanel>
        
    </div>
</asp:Content>

Coordinator
Sep 17, 2009 at 2:19 PM

Thanks for reporting the issue. I have uploaded a new version (1.1) that fixes the issue and also provides an example of using the control with a MasterPage.

Sep 17, 2009 at 3:10 PM

Thank you so much. I'll look into it.

Thank you so much for taking your time and help me.

Thank you.

I'll go check it out now.

 

Sep 17, 2009 at 8:22 PM

I downloaded and look at the example with master page. But I still see overlapping. I do see the header but still overlapping. You have following code in masterpage.

<div style="height: 100px; width:100%; background-color: Silver">
            Header
</div>

<asp:ContentPlaceHolder id="ContentPlaceHolder1" runat="server">
</asp:ContentPlaceHolder>

Because of still overlapping ( you dont' see the word "header" when you display the example masterpage), i changed the masterpage as followed to prevent the overlapping:

<div style="height: 30%; width:100%; background-color: Silver">
            Header
</div>

<div style="height: 70%; width:100%; background-color: red">

    <asp:ContentPlaceHolder id="ContentPlaceHolder1" runat="server">
    </asp:ContentPlaceHolder>

<div>

So on MasterPageExample.aspx, the splitterPanel will be inside the content place. Supposely there will be Header (top  30%, silver bgcolor ) and Content (bottom 70% of the page with red color). Inside Header the word "Header" should be displayed and in the red area the splitterPanel should display.

However, right now, splitterPanel is displaying starting from Header section through red section which in the other way, is overlapped, where suppose to be only displaying in the red part. 

Did I do something wrong? 

Coordinator
Sep 17, 2009 at 10:22 PM

Are you saying you ran the example and it did not work? Did you make any changes to the example before running it because it works fine here. Using percentages will not work with this control, you’ll have to stick to pixel values. What do you have set for the TopPosition property of your control and also what browser/version are you using?


From: layaroo [mailto:notifications@codeplex.com]
Sent: Thursday, September 17, 2009 4:23 PM
To: wdavidsen@yahoo.com
Subject: Re: Splitter Panel Width and Height. [splitterpanel:69149]

From: layaroo

I downloaded and look at the example with master page. But I still see overlapping. I do see the header but still overlapping. You have following code in masterpage.


Header

<asp:ContentPlaceHolder id="ContentPlaceHolder1" runat="server">
</asp:ContentPlaceHolder>

Because of still overlapping ( you dont' see the word "header" when you display the example masterpage), i changed the masterpage as followed to prevent the overlapping:


Header

<asp:ContentPlaceHolder id="ContentPlaceHolder1" runat="server">
</asp:ContentPlaceHolder>

So on MasterPageExample.aspx, the splitterPanel will be inside the content place. Supposely there will be Header (top 30%, silver bgcolor ) and Content (bottom 70% of the page with red color). Inside Header the word "Header" should be displayed and in the red area the splitterPanel should display.

However, right now, splitterPanel is displaying starting from Header section through red section which in the other way, is overlapped, where suppose to be only displaying in the red part.

Did I do something wrong?

Read the full discussion online.

To add a post to this discussion, reply to this email (splitterpanel@discussions.codeplex.com)

To start a new discussion for this project, email splitterpanel@discussions.codeplex.com

You are receiving this email because you subscribed to this discussion on CodePlex. You can unsubscribe on codePlex.com.

Please note: Images and attachments will be removed from emails. Any posts to this discussion will also be available online at codeplex.com