HTML5 Viewer in AngularJS project

Thread is closed for posting
10 posts, 0 answers
  1. F08C424B-1F8D-49EF-BC62-B2584BBA5BE5
    F08C424B-1F8D-49EF-BC62-B2584BBA5BE5 avatar
    5 posts
    Member since:
    Dec 2012

    Posted 19 Apr 2016 Link to this post

    Requirements

    Telerik Product and Version

    Reporting Q1 2016+

    Supported Browsers and Platforms

    .NET4+, AngularJS

    Components/Widgets used (JS frameworks, etc.)

    HTML5 Report Viewer


    PROJECT DESCRIPTION 
    Telerik Reporting HTML5 Viewer can be added in an AngularJS application. The Reporting REST service can be hosted separately in a standard .NET WebApplication. 

    The included script.js contains the logic for creating the viewer object and for updating an already existing viewer's reportSource. The start page is index.html.

  2. EFF18120-41EB-4CDA-A512-002F1796B7E8
    EFF18120-41EB-4CDA-A512-002F1796B7E8 avatar
    5 posts
    Member since:
    May 2016

    Posted 11 May 2016 in reply to F08C424B-1F8D-49EF-BC62-B2584BBA5BE5 Link to this post

    Hi,

    Thank you very much for the sample code. It is working well.

    I added a new .cs report named Questions.cs under Report folder. I am getting error "
    Error from report directive:Unable to get report parameters.<br/>Report 'Reports%2FQuestions.cs' cannot be resolved".

    In the example code it is invoking .trdx files; not .cs files

    Added below code in script.js

    .state("reports.questions", {
              url: "/questions",
              reportSettings: {
                  title: "Questions Report",
                  reportName: "Reports/Questions.cs",
                  reportParams: {}
              },

          })

    Please find the attached, sample code with my changes

  3. EFF18120-41EB-4CDA-A512-002F1796B7E8
    EFF18120-41EB-4CDA-A512-002F1796B7E8 avatar
    5 posts
    Member since:
    May 2016

    Posted 12 May 2016 in reply to EFF18120-41EB-4CDA-A512-002F1796B7E8 Link to this post

    Resolved the above issue by adding the cs file in a library project and giving "Libraryname.classname, Librayname" as report name parameter.
  4. 3D78FABF-3604-4921-AD8D-930AB537F0F8
    3D78FABF-3604-4921-AD8D-930AB537F0F8 avatar
    3610 posts
    Member since:
    Jul 2017

    Posted 13 May 2016 Link to this post

    Hi Mohamed,

    This is the correct approach, when you need to display a VS report. For more details, please check How to: Set ReportSource for Report Viewers (HTML5 Viewer).

    Regards,
    Stef
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  5. 6DF10229-E038-43AC-8F09-729D5EDC8833
    6DF10229-E038-43AC-8F09-729D5EDC8833 avatar
    8 posts
    Member since:
    Jun 2017

    Posted 16 Jun 2017 in reply to F08C424B-1F8D-49EF-BC62-B2584BBA5BE5 Link to this post

    I need to integrate report into my project using angularjs.. have any integration video demo or documentation from scratch?
  6. 70B72281-3EA8-4DDC-ADE3-83F8A6F2FC73
    70B72281-3EA8-4DDC-ADE3-83F8A6F2FC73 avatar
    3 posts
    Member since:
    Jun 2017

    Posted 12 Jul 2017 in reply to 3D78FABF-3604-4921-AD8D-930AB537F0F8 Link to this post

    Hi Stef,

    Is there an sample of the Report Viewer using Angular 2 (TypeScript) available?

     

    Regards,

    Daniel

  7. 9DBE8613-FE59-403C-AE38-D7D657EB0C91
    9DBE8613-FE59-403C-AE38-D7D657EB0C91 avatar
    1 posts
    Member since:
    Jul 2016

    Posted 29 Sep 2017 Link to this post

    This was a great article, and worked perfectly for me for 2016 R2, but I recently upgraded to and now the HTML Report viewer is failing to pass parameters to the service any more...

     

    When /parameters is called, the payload is accurate:

     

    {report: "DPR081.trdp", parameterValues: {RPAID: [240]}}
    parameterValues:{RPAID: [240]}
    report:"DPR081.trdp"

     

    But when it calls /instances, it omits the parameter name:

     

    {report: "DPR081.trdp", parameterValues: {undefined: [240]}}
    parameterValues:{undefined: [240]}
    report:"DPR081.trdp"

    There's been no change to my controller code server side or in the JS, the only thing I did was upgrade the Telerik Client Side JS and the Server Side DLLs.  

     

    Anyone else run into this yet?

     

     

     

     

  8. 73B6C1C3-D56D-4E87-B24B-568B28197605
    73B6C1C3-D56D-4E87-B24B-568B28197605 avatar
    13 posts
    Member since:
    Aug 2013

    Posted 07 Dec 2017 Link to this post

    Hi,

    I am looking for a sample application which will use Telerik Reporting using Angular JS 4 version. Could you please provide me link or a sample application that I can refer? Application can be very simple and should generate few basic reports. We need to make a decision if we should go ahead with Telerik reporting in our Web Portal Application which is based on Angular JS 4.

    Thanks,

    Sandep

  9. 73B6C1C3-D56D-4E87-B24B-568B28197605
    73B6C1C3-D56D-4E87-B24B-568B28197605 avatar
    13 posts
    Member since:
    Aug 2013

    Posted 07 Dec 2017 in reply to 73B6C1C3-D56D-4E87-B24B-568B28197605 Link to this post

    To be specific, I am looking for a sample using Angular Report Viewer, I read that Angular Report Viewer provides a component which wraps the HTML5 Report Viewer. But I am not sure how to use this. Could you please provide me the sample?
  10. 73B6C1C3-D56D-4E87-B24B-568B28197605
    73B6C1C3-D56D-4E87-B24B-568B28197605 avatar
    13 posts
    Member since:
    Aug 2013

    Posted 12 Dec 2017 in reply to 73B6C1C3-D56D-4E87-B24B-568B28197605 Link to this post

    I am waiting for this, please advice!
Back to Top

This Code Library is part of the product documentation and subject to the respective product license agreement.