Custom Parameter Editor - Dropdown Menu

[Moses Fetters]

Hi Everyone,

I've been trying to create a new report using a drop down list for parameters, but instead of a drop down, I'm getting a select list.  I followed the howto How To: Create a Custom Parameter Editor and added the JavaScript into my view (using MVC 5, Telerik Q3 2014 SP1 8.2.14.1204), as well as ensuring that the dropdownelement was using ".html" instead of ".htmll" (Error Found: How To Create a Custom Parameter Editor).  Any help would be appreciated.

@section header
{
    @Styles.Render("~/Content/telerikCss")
    <style type="text/css">
        #telerikReportViewer
        {
            overflow: hidden;
            width: 100%;
            height: 595px;
            min-height: 595px;
        }
    </style>
}

<div class="row">
    <div class="col-lg-12">
        @{
            var typeReportSource = new TypeReportSource { TypeName = Model.SelectedReportName };

            if (typeReportSource.TypeName == "")
            {
                typeReportSource.TypeName = null;
            }
        }

        @(Html.TelerikReporting().ReportViewer().Id("telerikReportViewer")
              .ServiceUrl(@Url.Content("~/api/reports/"))
              .TemplateUrl(@Url.Content("~/Content/ReportViewer/templates/telerikReportViewerTemplate-8.2.14.1204.html"))
              .ReportSource(typeReportSource)
              .ViewMode(ViewModes.PRINT_PREVIEW)
              .ScaleMode(ScaleModes.SPECIFIC)
              .Scale(1.0)
              .PersistSession(false)
              )
    </div>
</div>

@section scripts
{
    @Scripts.Render("~/bundles/reportsJS")
    <script type="text/javascript">

        $(document).ready(function() {
            $("#telerikReportViewer")
            .telerik_ReportViewer({
                parameterEditors: [
                    {
                        match: function (parameter) {
                            return Boolean(parameter.availableValues) && !parameter.multivalue;
                        },

                        createEditor: function (placeholder, options) {
                            var dropDownElement = $(placeholder).html('<div></div>'),
                                      parameter,
                                      valueChangedCallback = options.parameterChanged,
                                      dropDownList;

                            function onChange() {
                                var val = dropDownList.value();
                                valueChangedCallback(parameter, val);
                            }

                            return {
                                beginEdit: function (param) {

                                    parameter = param;

                                    $(dropDownElement).kendoDropDownList({
                                        dataTextField: "name",
                                        dataValueField: "value",
                                        dataSource: parameter.availableValues,
                                        change: onChange
                                    });

                                    dropDownList = $(dropDownElement).data("kendoDropDownList");
                                }
                            };
                        }
                    }]
            });
        });
    </script>
}

[Stef]

Hello Moses,

The parameterEditor option is available only for the HTML5 Report Viewer jQuery widget. The MVC wrapper does not provide yet such option, and it is logged in our system for improvement. Thus you can remove the MVC wrapper from the page and leave only the jQuery object.

If you want to raise the priority of the task, feel free to log it in our public feedback portal where features are considered for implementation based on the demand for them.


Let us know if you have any further questions.

Regards,
Stef
Telerik

 

 

[Shane]

Is there a way to, create the report with mvc razor, and then use jquery to set $("#ReportViewer1") parameterEditors?

[Stef]

Hi Shane,

The parameterEditors setting must be applied on creating the viewer object, which is supported only with the jQuery widget. The MVC wrapper of the widget does not support setting custom parameters editors yet. Note that the wrapper will produce the same jQuery widget that you can set initially in the view.

Regards,
Stef
Telerik