combit List & Label 26 - .NET Hilfe
Einführung in die Programmierung / Beispiele / Web Reporting / Verwendung des HTML5-Viewers
In diesem Thema
    Verwendung des HTML5-Viewers
    In diesem Thema

    Der HTML5-Viewer steht in ASP.NET WebForms und ASP.NET MVC Applikationen zur Verfügung und unterstützt alle gängigen Browsertypen. Dadurch ist er auf Clients mit unterschiedlichen Betriebssystemen einsetzbar. Er erlaubt eine interaktive Eingabe durch Drilldown und Berichtsparameter.

    Grundkonzepte

    Einbindung

    Zur Einbindung des HTML5-Viewers in Ihre Anwendung gehen Sie wie folgt vor. Weitere Details können Sie den mitgelieferten Anwendungsbeispielen für ASP.NET entnehmen.

     Step 1: HTML5-Viewer zur Anwendung hinzufügen

    ASP.NET Web Forms:

    In einer ASP.NET WebForms Anwendung können Sie einfach das Html5ViewerControl aus dem Namespace combit.Reporting.Web aus der combit.ListLabel26.Web.dll hinzufügen. Vergleichen Sie dazu bitte auch das Beispiel im List & Label Installationsverzeichnis 'Web Reporting Sample'.

    <%@ Register TagPrefix="combit" Namespace="combit.Reporting.Web" Assembly="combit.Reporting.Web" %>
    <html>
    <head>
        <title><asp:Literal ID="LTViewerTitle" runat="server"></asp:Literal></title>
    </head>
    <body>
        <form method="post" runat="server">
            <div>
                <combit:Html5ViewerControl ID="Html5ViewerControl1" runat="server"></combit:Html5ViewerControl>
            </div>
        </form>
    </body>
    </html>
    

     

    ASP.NET MVC:

    @using combit.Reporting.Web
    @{
        Layout = null;
    }
    <!DOCTYPE html>
    <html>
    <head>
        <meta name="viewport" content="width=device-width" />
        <title>@ViewBag.Title</title>
    </head>
    <body>
        <div>
            @Html.Html5Viewer((string)ViewBag.InstanceName, null);
        </div>
    </body>
    </html>
    
    @Imports combit.Reporting.Web
    @Code
         Layout = Nothing
    END Code
    <!DOCTYPE html>
    <html>
    <head>
        <meta name="viewport" content="width=device-width" />
        <title>@ViewData("Title")</title>
    </head>
    <body>
        <div>
            @Html.Html5Viewer(DirectCast(ViewData("InstanceName"), String), Nothing);
        </div>
    </body>
    </html>                     
    

    Vergleichen Sie dazu bitte auch das Beispiel im List & Label Installationsverzeichnis unter 'MVC Web Reporting Sample'. 

     Step 2: Daten, Projektdatei und andere Daten serverseitig einstellen

    Der HTML5-Viewer nutzt zur internen Verarbeitung der HTTP-Requests immer ASP.NET MVC. Es müssen daher in der Application_Start()-Funktion Ihrer Anwendung (Global.asax-Datei) die notwendigen Routen registriert werden – auch wenn Sie in Ihrer Anwendung nicht auf ASP.NET MVC setzen. Fügen Sie folgende Zeilen ein:

    Html5ViewerConfig.RegisterRoutes(RouteTable.Routes);
    Html5ViewerConfig.OnListLabelRequest += Services_OnListLabelRequest;
    
    Html5ViewerConfig.RegisterRoutes(RouteTable.Routes)
    AddHandler Html5ViewerConfig.OnListLabelRequest, AddressOf Services_OnListLabelRequest
    

    Wichtig: Falls Sie selbst MVC/Web API einsetzen, muss die Html5ViewerConfig.RegisterRoutes-Funktion unbedingt vor Ihren eigenen Routen registriert werden.  

     

    Im Ereignis-Handler werden die für den HTML5-Viewer benötigten Daten übergeben.

    private void Services_OnListLabelRequest(object sender, ListLabelRequestEventArgs e)
    {
        ListLabel ll = new ListLabel();
       
        // set license key for List & Label (client + server). If not set, a license error will be displayed on non-development machines.
        ll.LicensingInfo = "<ToDo: insert license here>";
       
        ll.DataSource = DataAccess.SampleData.CreateProviderCollection(reportName);
       
        ll.AutoProjectFile = _reportsPath + e.ReportName;
        e.ExportPath = Path.GetTempPath(); // set temp directory;
       
        e.NewInstance = ll;
    }
    
    Private Sub Services_OnListLabelRequest(sender As Object, e As ListLabelRequestEventArgs)
        Dim ll As New ListLabel()
        ' set license key for List & Label (client + server). If not set, a license error will be displayed on non-development machines.
        ll.LicensingInfo = "<ToDo: insert license here>"
        ll.DataSource = DataAccess.SampleData.CreateProviderCollection(reportName)
        ll.AutoProjectFile = _reportsPath + e.ReportName
        e.ExportPath = Path.GetTempPath() ' set temp directory;
        e.NewInstance = ll
    End Sub
    
                   

    Der Name des gewählten Berichts kann in ASP.NET WebForms über die Eigenschaft ReportName des Html5ViewerControl-Objekts gesetzt werden. In ASP.NET MVC kann er direkt in der HtmlHelper-Erweiterungsmethode @Html.Html5Viewer() als Parameter übergeben werden.

    Im OnListLabelRequest-Event steht dieser Name unter e.ReportName wieder zur Verfügung, sodass Sie die passende Datenquelle und Projektdatei laden können.

     

    Optionen
    Die Klasse Html5ViewerOptions, die Sie der Options-Eigenschaft des Html5ViewerControl zuweisen oder der HtmlHelper-Erweiterungsmethode @Html.Html5Viewer() als Parameter übergeben können, bietet die Möglichkeit zu bestimmen, woher die notwendigen jQuery und jQuery Mobile-Dateien geladen wer-den können (CDNType), welche CSS-Dateien geladen werden sollen (ThemeCSSUrl, ThemeIconsCSSUrl) oder welches jQuery Mobile Theme benutzt werden soll (Data-Theme). Für nähere Hinweise zu diesen Formatierungsoptionen verwenden Sie bitte die jQuery Mobile Hilfe im Internet.