I'm an experienced web developer, software engineer, and leader. Welcome to my blog. If you need to reach out you can continue the conversation with a tweet to @geedew. I hope you find what you are looking for here. You can also find me on Github and StackOverflow.

jQuery Dialog Shadow Issues.

While working on a dialog in the new jQuery UI 1.6rc6. I have come accross an issue.

If you were to open a dialog, and then dynamically change the content in the dialog, the shadow border will not resize. The problem is, the code does not ‘know’ the box is larger, and is not able to watch for the changes. Their have been some solutions that I have found to solve this, like turning off shadows, etc. But I think I have a better one, a 3-line solution so to speak
Go into your code, mine is in my jquery-ui-personalized-1.6rc6.js file… Also could be in ui.dialog.js etc.

Inside the code (mine is line 4218) after this function

1
2
$.widget('ui.dialog', {
_init: function() {

add this function

1
2
3
refresh: function() {
this._refreshShadow(1);
},

Then from within your code you can call something like this…
$('#dialogbox').dialog('refresh');

Check for updates, I may write a drop-in style patch so the coding isn’t necessary.

Enjoy!