This is a migrated thread and some comments may be shown as answers.

Printing a pane

8 Answers 154 Views

Splitter

This is a migrated thread and some comments may be shown as answers.

Michael Dunbar asked on 22 Jan 2008, 02:19 PM

Hello,

I read the tutorial on printing a pane, which is great, but I need to do something slightly different and was just wondering if it was possible.

The documentation gives the following code:

 <a href="javascript:PrintPane('<%=
LeftPane.ClientID %>');">Print the content of 'Left
Pane'</a><br />

<a href="javascript:PrintPane('<%= ExternalContentPane.ClientID
%>');">Print the content of 'External Content Pane'</a>

<script type="text/javascript">

function PrintPane (paneID)

{

  var splitter = $find('<%= RadSplitter1.ClientID%>');

  var pane = splitter.GetPaneById(paneID);



  if (!pane) return;



  var cssFileAbsPath = 'http://localhost/printStyles.css';

  var arrExtStylsheetFiles = [

    cssFileAbsPath

  ];



  pane.Print(arrExtStylsheetFiles);

}

</script>



How do I get this working if the splitter is contained in a Master page and the button that is to call the print function resides in a user control that is called within the content pane of the splitter that I want to print?



The code provided obviously can't find the splitter or the pane ID as it is in the master.



Thanks,



Michael

8 Answers, 1 is accepted

answered on 23 Jan 2008, 08:23 AM

Hello Michael Dunbar,
I am not quite sure why you get the described error. I made a simple example and everything works as expected:

master page:

    
            <body>  
        
            <script type="text/javascript">  
        
            function PrintPane (paneID)  
        
            {  
        
              var splitter = $find('<%= RadSplitter1.ClientID%>');  
        
              var pane = splitter.GetPaneById(paneID);  
        
              if (!pane) return;  
        
              var cssFileAbsPath = 'http://localhost/printStyles.css';  
        
              var arrExtStylsheetFiles = [  
        
                cssFileAbsPath  
        
              ];  
        
              pane.Print(arrExtStylsheetFiles);  
        
            }  
        
            </script>  
        
                <form id="form1" runat="server">  
        
                    <asp:ScriptManager ID="ScriptManager1" runat="server" />  
        
                    <asp:contentplaceholder id="ContentPlaceHolder1" runat="server">  
        
                    </asp:contentplaceholder>  
        
                    <telerik:RadSplitter ID="RadSplitter1" runat="server">  
        
                        <telerik:RadPane ID="RadPane1" runat="server"></telerik:RadPane>  
        
                        <telerik:RadPane ID="RadPane2" runat="server"></telerik:RadPane>  
        
                    </telerik:RadSplitter>  
        
                </form>  
        
            </body>

page:

    
            <%@ Register Src="~/WebUserControl.ascx" TagName="control" TagPrefix="uc1" %> 
        
            <asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">  
        
            <uc1:control ID="Control1" runat="server" /> 
        
            </asp:Content>

user control:

    
            <a href="javascript:PrintPane('<%= this.Page.Master.FindControl("RadPane1").ClientID %>');">Print the content of pane</a><br />

In case this does not help you, please open a new support ticket and send us a simple running project, demonstrating the problem.

Sincerely yours,
Tsvetie
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center

answered on 23 Jan 2008, 10:04 AM

Could it be down to the fact I am loading the user control dynamically?

private void PopulatePageContent()
    {
        switch (PageType)
        {
            case Enumeration.PageType.Home:
                UserControl home = (UserControl)LoadControl("~/UI/UserControls/Home.ascx");
                cphContent.Controls.Add(home);
                break;

            case Enumeration.PageType.Search:
                UserControl search = (UserControl)LoadControl("~/UI/UserControls/Search.ascx");
                cphContent.Controls.Add(search);
                break;

            default:
                UserControl content = (UserControl)LoadControl("~/UI/UserControls/LibriosContent.ascx");
                cphContent.Controls.Add(content);
                break;
        }
    }

It looks like a life cycle problem. I'll have a think but if you have any further suggestions they are welcome.

Thanks,

Michael

answered on 23 Jan 2008, 11:07 AM

Bit more testing and I have identified the problem.

My splitter is nested in a content place holder so the only way I can access the pane is via this hard coded ID: ctl00_cphMain_rpContentPane. Obviously this is a fudge, so how do I get the ID dynamically? This is what I have to make it work:

function PrintPane (paneID)
    {
      var splitter = $find('<%= rspSplitter.ClientID%>');
      var pane = splitter.GetPaneById('ctl00_cphMain_rpContentPane');
      if (!pane) return;

      pane.Print();

I can't seem to access the pane from:

javascript:PrintPane('<%= this.Page.Master.FindControl("rpContentPane").ClientID %>')

I need to find the placeholder first I think?

answered on 23 Jan 2008, 12:29 PM

Hello Michael Dunbar,
Please note that this problem is not directly connected to our controls. In case you needed the ClientID of a Button from the UserControl, instead of the RadPane, you would end up in the same situation.

At this point, I believe passing the Index of the RadPane you wish to print and using the getPaneByIndex client method of the RadSplitter to get a reference to the RadPane client object, would be easier.

For example:

    
            <script type="text/javascript">  
        
            function PrintPane (paneIndex)  
        
            {  
        
              var splitter = $find('<%= RadSplitter1.ClientID%>');  
        
              var pane = splitter.GetPaneByIndex(paneIndex);  
        
              if (!pane) return;  
        
              var cssFileAbsPath = 'http://localhost/printStyles.css';  
        
              var arrExtStylsheetFiles = [  
        
                cssFileAbsPath  
        
              ];  
        
              pane.Print(arrExtStylsheetFiles);  
        
            }  
        
            </script>

    
            <a href="javascript:PrintPane('0');">Print the content of pane</a><br />

Regards,
Tsvetie
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center

Product Bundles

DevCraft

Web

Mobile

Document Management

Desktop

Reporting & Mocking

Automated Testing

CMS

UI/UX Tools

Debugging

Free Tools

Support and Learning

Productivity and Design Tools

Printing a pane

8 Answers, 1 is accepted