How to pass multiple values using custom data

To pass multiple custom data values to the Bold Reports® JavaScript Report Viewer Web API, send them as JSON through the ‘data’ property in the ajaxBeforeLoad event. Then deserialize them in the server-side API with a known class type and JsonConvert.DeserializeObject.

  1. Map the ajaxBeforeLoad event with onAjaxRequest function in the script to pass custom data to the server.

         <script type="text/javascript">
             $(function () {
                 $("#viewer").boldReportViewer({
                     reportServiceUrl: "/api/ReportViewer",
                     reportPath: '~/Resources/docs/sales-order-detail.rdl',
                     ajaxBeforeLoad: onAjaxRequest
                 });
             });
    
             function onAjaxRequest(args) {
                 //Passing custom data to server
             }
         </script>
  2. Pass the multiple custom data values as JSON and use the data property to send the custom data to the server in the Ajax request.

        <script type="text/javascript">
            $(function () {
                $("#viewer").boldReportViewer({
                    reportServiceUrl: "/api/ReportViewer",
                    reportPath: '~/Resources/docs/sales-order-detail.rdl',
                    ajaxBeforeLoad: onAjaxRequest
                });
            });
    
            function onAjaxRequest(args) {
                //Passing custom data to server
                var jsonData = {
                                 customerID: "CI0021",
                                 productID: "PO0022"
                               };
                args.data = jsonData;
            }
        </script>
  3. The custom data values are stored in the customData header key, and you can store them in the local property. The following code sample deserializes the JSON string and changes the data source connection strings based on the Customer ID and Product ID in the OnInitReportOptions method.

        public SampleData customDatas = new SampleData();
    
        public class SampleData
        {
            public string customerID { get; set; }
            public string productID { get; set; }
        }
    
        [HttpPost]
        public object PostReportAction([FromBody]Dictionary<string, object> jsonResult)
        {
            if (jsonResult.ContainsKey("customData"))
            {
                //Get client side JSON custom data, desirialize it and store in local variable.
                customDatas = JsonConvert.DeserializeObject<SampleData>(jsonResult["customData"].ToString());
            }
    
            return ReportHelper.ProcessReport(jsonResult, this, this._cache);
        }
    
        public void OnInitReportOptions(ReportViewerOptions reportOption)
        {
            if (customDatas != null)
            {
                if (customDatas.customerID == "CI0021" && customDatas.productID == "PO0022") {
                    //If you are changing the connection string based on customer id then could you please change the connection string as below.
                    //reportOption.ReportModel.DataSourceCredentials.Add(new BoldReports.Web.DataSourceCredentials("<Datasource name>", "<connection string>"));
                    reportOption.ReportModel.DataSourceCredentials.Add(new BoldReports.Web.DataSourceCredentials("<database>", "Data Source=<instancename>;Initial Catalog=<database>;"));
                }
            }
        }