Mark Mintoff My superpower is common sense


Wrapped JQuery Show Dialog

One of the things I like doing best in programming (even if it is client-side) is encapsulating code into simple method/function calls, in order to prevent writing the same code over and over. My ShowDialog method is an example of such.

I like the JQuery Dialog, especially since an IFrame can be loaded into it and I am in the habit of utilizing this. The reason I prefer using an IFrame in this manner, is that I can segregate the code into another .aspx page, allowing me to keep everything neat and tidy. It is also worth noting that I have a preference for making these kind of dialogs modal. If you do not prefer using modal dialogs, then you will have to tweak the coding a little bit.

To this end, my sequence of coding for showing a dialog is to append a DIV containing my IFrame to the body, calling the JQuery Dialog code and removing the div onClose:

And there you have it! (for String.Format please refer here)

A simple wrapping function call to load a modal dialog with a specified page url, a specified width and height and an optional onClose function to be executed on closing the dialog. The latter is useful for cases where you wish to refresh the page or do a redirect.

An example of using this method, from server side C#:

As you can see, I am using String.Format to specify two arguments:
  • path.ToString
  • Page.ClientScript.GetPostBackEventReference

path.ToString in this case, is a StringBuilder which assembles the path to the Dialog page (I am using a StringBuilder because a dynamic querystring is being constructed for it) and the Page.ClientScript.GetPostBackEventReference is being used in order to cause a page refresh on closing the dialog.

A simpler example:

In this example, I am not passing in an onClose function, hence nothing special will happen after the dialog is closed.

Happy Coding!

VN:F [1.9.22_1171]
Rating: 0.0/5 (0 votes cast)
Comments (0) Trackbacks (1)

Leave a comment