SSRS – Use custom javascript to call a report in a new tab/window.

There are times when you have a report and want to display more information about an item by clicking on it but the extra info should be on a new report in a new window/tab instead, keeping your current report intact; sort of a drill down.

If you need to pass a lot of parameters to the new report without generating an over-sized URL (some browsers will reject URLs longer than 2000 characters) or simply don’t want to expose your parameters onto your URL for whatever reason then a form element with an HTTP POST method might help you.

In this example we create a report showing the connections to the server and we want to click on a specific connection id and have the sessions of that connection in a separate report.

When we move the mouse arrow over the connection id it changes into a hand indicating there’s an action if we click on it.

After clicking on the parent, the child report appears in new tab (or window, depending on the browser’s settings) leaving the first report as is.

In order to be able to call a report the way we want it in a new tab using the post method, we need to write our own custom javascript function to do it.  Reporting Services loads ReportingServices.js javascript file at the beginning of each session, so we can add our own function in this file and have it available in the report.  So edit the javascript file to add the function first.

Locate ReportingServices.js in your system and open for editing.

Add the function into the file:

function cf_Open_Window_Report(pConnectionID) {
  var f = document.createElement('FORM');
  var paramArray;
  var paramIdx;
  document.body.appendChild(f);
  f.method = "post";
  f.action = "http://" + window.location.host 
             + "/ReportServer?/Admin Reports/003.Server sessions";
  f.setAttribute("target", "_blank");

  var p = document.createElement("<input name='rs:Command' type='hidden'>");
  f.appendChild(p);
  p.value = "render";

  p = document.createElement("<input name='rpConnectionID' type='hidden'>");
  f.appendChild(p);
  p.value = pConnectionID;

  f.submit();
}

Then use the action property of connection id text box to call the javascript function.

Set the action property of Connection ID text box setting it to “Go to URL”. Then press the ƒx button to edit the URL expression.

In the expression box type the function and pass it the required parameters.

Edit the expression to call the custom JavaScript function which opens the second report.

That’s it.