Reporting Services 2008 open modal dialog

In Reporting Services 2008 there are two possibilities for opening a link to a URL:

• Define an action
• Create your own href link

I wanted a window that would open as a modal dialog. Both these methods do not offer this functionality out of the box. But it is pretty easy to do this using a little javascript.

Define an action

To start with let’s focus on the first method.

Create a placeholder on an empty textbox.

 

Fill in the Label and Value properties. The Label is what you see when the report is in design mode and the Value is what the viewer of the report sees.

Next define the action that should take us to the URL.

Choose the “Go to URL” radiobutton to enable the “Select URL” editbox. This is where some javascript code surrounds the URL (CNN.com) that we want to open in the modal dialog:

j avascript:void(window.showModalDialog(‘http://cnn.com‘))

[Remove the space after the j of javascript. I incorporated this because otherwise it gets blocked by the blog engine]

The window.showModalDialog is a method that opens a modal dialog. The first parameter is a URL. In this case http://cnn.com. The function does have more parameters like the size of the window, if it is resizable, etc. The specs of the method can be found here.

The void operator makes sure that the return value of the method is not used (literally thrown into the void). If this operator is left out the browser can try to assign the return value to the href attribute.

Create your own href link

Method number two was to create your own href link. Why do this? Well because it will immediately look like a link. The action textbox will have to get some additional formatting to signal the user that they can click on it. There are probably more arguments, but let’s look at how it is done.

The first step is the same as the previous method: create a placeholder on an empty textbox.

Fill the Label and the Value properties, and set the “Markup type” to HTML.

The Value property gets the following value:

="<a href=""j avascript:void(window.showModalDialog('http://cnn.com'))"">My link</a>" 

[Remove the space after the j of javascript. I incorporated this because otherwise it gets blocked by the blog engine]

As you can see this is just plain html. It has the same javascript entry as the href attribute. Pay attention to the quotes. After the href= and before the first > two double quotes are used!

This TechNet article gives more information about using HTML within a textbox (and the limitations there are).

Share this