HTML5 Report Viewer - Report don't get value from drpdownlist and not refreshed ?

5 posts, 0 answers
  1. Ahmed Amin
    Ahmed Amin avatar
    34 posts
    Member since:
    Apr 2015

    Posted 22 Apr 2015 Link to this post

    Hi

    i have create report with telerik html5 and it works first time only page is loaded and if i change select from drpdownlist nothing happened and report don't get new value that changed and i don't know why that (i have add js code to get drpdownlist "change" but it's not fired)?!

    @model Hemdan.Models.Product
     
    @{
        ViewBag.Title = "Home Page";
    }
     
     
    <div>
        @Html.DropDownListFor(model => model.ProductID, (SelectList)ViewBag.ProductID, new { @class = "form-control", style = "width: 150px; font-weight: bold; margin:auto;", id = "ProductID" })
        @Html.ValidationMessageFor(model => model.ProductID, "", new { @class = "text-danger" })
        <br />
        <div id="reportViewer1">
            loading...
        </div>
    </div>
     
    @section scripts
    {
        <script type="text/javascript">
            $(document).ready(function () {
                $("#reportViewer1")
                    .telerik_ReportViewer({
                        serviceUrl: "/api/reports/",
                        templateUrl: '/ReportViewer/templates/telerikReportViewerTemplate-9.0.15.225.html',
                        reportSource: {
                            report: "Hemdan.Views.kinds.Report1, Hemdan",
                            parameters: { Item: $('#ProductID option:selected').val() }
                        },
                        viewMode: telerikReportViewer.ViewModes.INTERACTIVE,
                        scaleMode: telerikReportViewer.ScaleModes.SPECIFIC,
                        scale: 1.0,
     
                        ready: function () {
                            //this.refreshReport();
                        }
                    });
            });
     
            $('#ProductID').change(function () {
                var viewer = $("#reportViewer1").data("telerik_ReportViewer");
                viewer.reportSource({
                    report: viewer.reportSource().report,
                    parameters: { Item: $(this).val() }
                });
                viewer.refreshReport();
            });
        </script>
    }

    i do all steps as: http://www.telerik.com/help/reporting/html5-report-viewer-howto-custom-parameters.html

    so please how can i make it works - cloud you please fix my code to let how to it or give me small sample ...

    Thanks a lot ....

  2. Ahmed Amin
    Ahmed Amin avatar
    34 posts
    Member since:
    Apr 2015

    Posted 26 Apr 2015 in reply to Ahmed Amin Link to this post

    any help with that please .... ?
  3. DevCraft banner
  4. Stef
    Admin
    Stef avatar
    3044 posts

    Posted 27 Apr 2015 Link to this post

    Hello Ahmed,

    Please refer to my post in your other forum thread on the same question - HTML5 Report Viewer - Report not refreshed if i change values in DB ?


    If you need further help, please let us continue the discussion in the above linked forum thread.
    Thank you for your understanding.

    Regards,
    Stef
    Telerik
     

    See What's Next in App Development. Register for TelerikNEXT.

     
  5. Ahmed Amin
    Ahmed Amin avatar
    34 posts
    Member since:
    Apr 2015

    Posted 29 Apr 2015 in reply to Stef Link to this post

    Hi

    here i mean if select any value from dropdownlist - nothing happened and report not do any thing (don't get any paramater value from the dropdownlist ?) .... ??!!

  6. Ahmed Amin
    Ahmed Amin avatar
    34 posts
    Member since:
    Apr 2015

    Posted 29 Apr 2015 Link to this post

    Hi

    i try it again from scratch and its finaly work

    Full Code Now:

    @model WebApplication1.Models.Product
     
    @{
        ViewBag.Title = "Home Page";
    }
     
     
     
    @Html.DropDownListFor(model => model.ProductID, (SelectList)ViewBag.ProductID, "", new { @class = "form-control", style = "width: 150px; font-weight: bold" })
    @Html.ValidationMessageFor(model => model.ProductID, "", new { @class = "text-danger" })
    <br />
     
    @* Order Report *@
    <div id="reportViewer1" style="height:1241px;">
        loading...
    </div>
    <br />
     
    @section scripts
    {
     
        @* Order Report *@
        <script>
            $(document).ready(function () {
                $("#reportViewer1")
                    .telerik_ReportViewer({
                        serviceUrl: "/api/reports",
                        templateUrl: '/ReportViewer/templates/telerikReportViewerTemplate-9.0.15.324.html',
                        reportSource: {
                            report: "WebApplication1.Report1, WebApplication1",
                            parameters: { OrderID: $('#ProductID option:selected').val() }
                        },
                        viewMode: telerikReportViewer.ViewModes.INTERACTIVE,
                        scaleMode: telerikReportViewer.ScaleModes.SPECIFIC,
                        scale: 1.0,
                    });
            });
     
            $('#ProductID').change(function () {
                var viewer = $("#reportViewer1").data("telerik_ReportViewer");
                viewer.reportSource({
                    report: viewer.reportSource().report,
                    parameters: { Orderid: $(this).val() }
                });
                viewer.refreshReport();
            });
        </script>
    }

Back to Top
DevCraft banner