New to Telerik UI for ASP.NET AJAX? Download free 30-day trial

PDF Multi Page Export

  • Main Course
  • Desserts
  • Soups
  • Seafood
image

Beef Stewed in a Salty Herb Crust

  • 800 gr beef bonfile
  • 2 tablespoons olive oil
  • 1 tabslespoon butter
  • salt and pepper

For the crust:

  • 120 gr cooking salt
  • 200 gr sea salt
  • 500 gr butter
  • 2 egg whites
  • 250 ml water
  • 2 tablespoons of rosmarin and salvia
image

Lavender Ice Cream

  • 250 ml cream 35%
  • 1 can of condensed milk
  • 1 can of sweetened condensed milk
  • 1 vanilla bean
  • 1 tablespoon lavender flowers
image

Creamy Soup with Port Wine and Cheese

  • 2 tablespoons butter
  • 1 onion
  • 450 gr carrots
  • 500 ml vegetable stock
  • 100 gr. Feta cheese
  • 3 tablespoons Port wine
  • 2 tablespoons fresh dill
image

Clam, Spinach and Peanut Stew

  • 1 onion
  • 30 ml olive oil
  • 500 gr white clams
  • 100 gr raw peanuts
  • 2 small tomatoes
  • 100 gr spinach
  • 200 gr. rice
  • salt and pepper

The images and recipies have been adjusted for the purpose of this demo. The originals belong to kulinarno-joana.com.

With RadClientExportManager you can split the exported content to different pages. To do that use the PageBreakSelector property to specify at which point to end a certain page.

Note that for the purposes of the demo additional CSS class named k-pdf-export is applied to the exported element to display all of the page views during the exporting process.

  • DefaultCS.aspx
  • DefaultCS.aspx.cs
  • styles.css
<%@ Page AutoEventWireup="true" CodeFile="DefaultCS.aspx.cs" Inherits="ClientExportManager.Functionality.MultiPage.DefaultCS"Language="c#"  %>

<%@ Register TagPrefix="qsf" Namespace="Telerik.QuickStart" %>
<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
<!DOCTYPE html>
<html xmlns='http://www.w3.org/1999/xhtml'>
<head runat="server">
    <title>Telerik ASP.NET Example</title>
    <link href="styles.css" rel="stylesheet" />

    <!-- Load Pako ZLIB library to enable PDF compression -->
    <script src="../../../Common/Scripts/pako.min.js"></script>
</head>
<body>
    <form id="form1" runat="server">
    <telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
    <telerik:RadSkinManager ID="RadSkinManager1" runat="server" ShowChooser="true" />
    <div class="demo-container no-bg">
        <telerik:RadClientExportManager runat="server" ID="RadClientExportManager1">
            <PdfSettings PageBreakSelector=".pageBreak" MarginRight="10mm" PaperSize="A5" Landscape="true" MarginBottom="10mm" MarginTop="10mm" MarginLeft="10mm" />
        </telerik:RadClientExportManager>

        <div class="exportButtonContainer">
            <telerik:RadButton RenderMode="Lightweight" runat="server" Skin="Silk" OnClientClicked="exportAllRecipes" Text="Export All Recipes to PDF" AutoPostBack="false" UseSubmitBehavior="false"></telerik:RadButton>
        </div>

        <telerik:RadMultiPage runat="server" ID="RadMultiPage1" SelectedIndex="0" CssClass="outerMultiPage">
            <telerik:RadPageView runat="server" ID="RadPageView1">
                <telerik:RadTabStrip RenderMode="Lightweight" runat="server" ID="RadTabStrip2" MultiPageID="RadMultiPage2"
                    Orientation="VerticalLeft" Skin="Silk" Width="50px" Height="355px" SelectedIndex="0">
                    <Tabs>
                        <telerik:RadTab ImageUrl="images/icon_AllRecipes.png" ToolTip="Main Course" SelectedImageUrl="images/icon_AllRecipes.png" HoveredImageUrl="images/icon_AllRecipes.png" Height="40px"></telerik:RadTab>
                        <telerik:RadTab ImageUrl="images/icon_Desserts.png" ToolTip="Desserts" SelectedImageUrl="images/icon_Desserts.png" HoveredImageUrl="images/icon_Desserts.png" Height="40px"></telerik:RadTab>
                        <telerik:RadTab ImageUrl="images/icon_Soups.png" ToolTip="Soups" SelectedImageUrl="images/icon_Soups.png" HoveredImageUrl="images/icon_Soups.png" Height="40px"></telerik:RadTab>
                        <telerik:RadTab ImageUrl="images/icon_Seafood.png" ToolTip="Seafood" SelectedImageUrl="images/icon_Seafood.png" HoveredImageUrl="images/icon_Seafood.png" Height="40px"></telerik:RadTab>
                    </Tabs>
                </telerik:RadTabStrip>
                <telerik:RadMultiPage runat="server" ID="RadMultiPage2" SelectedIndex="0" CssClass="innerMultiPage">
                    <telerik:RadPageView runat="server" ID="PageView1" CssClass="recipePage">
                        <div class="recipeImage qsf-ib">
                            <img src="images/Beef_Stewed.png" alt="image" />
                        </div>
                        <div class="ingredients qsf-ib">
                            <p>Beef Stewed in a Salty Herb Crust</p>
                            <ul>
                                <li>800 gr beef bonfile</li>
                                <li>2 tablespoons olive oil</li>
                                <li>1 tabslespoon butter</li>
                                <li>salt and pepper</li>
                            </ul>
                            <p class="subtitle">For the crust:</p>
                            <ul>
                                <li>120 gr cooking salt </li>
                                <li>200 gr sea salt</li>
                                <li>500 gr butter</li>
                                <li>2 egg whites</li>
                                <li>250 ml water</li>
                                <li>2 tablespoons of rosmarin and salvia</li>
                            </ul>
                        </div>
                    </telerik:RadPageView>
                    <telerik:RadPageView runat="server" ID="PageView2" CssClass="recipePage pageBreak">
                        <div class="recipeImage qsf-ib">
                            <img src="images/Lavender_Ice_Cream.png" alt="image" />
                        </div>
                        <div class="ingredients qsf-ib">
                            <p>Lavender Ice Cream</p>
                            <ul>
                                <li>250 ml cream 35%</li>
                                <li>1 can of condensed milk</li>
                                <li>1 can of sweetened condensed milk</li>
                                <li>1 vanilla bean</li>
                                <li>1 tablespoon lavender flowers</li>
                            </ul>
                        </div>
                    </telerik:RadPageView>
                    <telerik:RadPageView runat="server" ID="PageView3" CssClass="recipePage pageBreak">
                        <div class="recipeImage qsf-ib">
                            <img src="images/Creamy_Soup.png" alt="image" />
                        </div>
                        <div class="ingredients qsf-ib">
                            <p>Creamy Soup with Port Wine and Cheese</p>
                            <ul>
                                <li>2 tablespoons butter </li>
                                <li>1 onion</li>
                                <li>450 gr carrots</li>
                                <li>500 ml vegetable stock</li>
                                <li>100 gr. Feta cheese</li>
                                <li>3 tablespoons Port wine </li>
                                <li>2 tablespoons fresh dill</li>
                            </ul>
                        </div>
                    </telerik:RadPageView>
                    <telerik:RadPageView runat="server" ID="PageView4" CssClass="recipePage pageBreak">
                        <div class="recipeImage qsf-ib">
                            <img src="images/Clam_Spinach_and_Peanut_Stew.png" alt="image" />
                        </div>
                        <div class="ingredients qsf-ib">
                            <p>Clam, Spinach and Peanut Stew</p>
                            <ul>
                                <li>1 onion</li>
                                <li>30 ml olive oil</li>
                                <li>500 gr white clams</li>
                                <li>100 gr raw peanuts</li>
                                <li>2 small tomatoes</li>
                                <li>100 gr spinach</li>
                                <li>200 gr. rice</li>
                                <li>salt and pepper</li>
                            </ul>
                        </div>
                    </telerik:RadPageView>
                </telerik:RadMultiPage>
            </telerik:RadPageView>
        </telerik:RadMultiPage>
        <div class="disclaimer">
            <p>
                The images and recipies have been adjusted for the purpose of this demo.
                The originals belong to <b>kulinarno-joana.com</b>.
            </p>
        </div>
    </div>
    <script type="text/javascript">
        function exportAllRecipes() {
            var cem = $find("<%=RadClientExportManager1.ClientID%>");

            cem.exportPDF($telerik.$(".innerMultiPage"));
        }

    </script>
    </form>
</body>
</html>

Support & Learning Resources

Find Assistance