Thickbox/jquery kills my spry dataset

Report · Dec 10, 2008

I've been working with a spry dataset on a project that I've recently added Thickbox to. Once I've added the 2 required js script files to the header, the dataset stopped displaying any data.I found a detailed thread about this very problem in the forums, but all the combinations of adding an observer to my spry dataset haven't helped at all. Here is the code of the latest attempt - anyone see where I went wrong?

Report · Dec 11, 2008

The main reason can be that Thickbox is triggered before the dataset is
fully loaded:

You can try this:
1.- Open thickbox.js, Copy the content include in the function attached to
"$(document).ready" (lines 14 to 16):
tb_init('a.thickbox, area.thickbox, input.thickbox');//pass where to apply
thickbox
imgLoader = new Image();// preload image
imgLoader.src = tb_pathToImage;

2.- Comment the whole function, because we'll trigger it using Spry

3.- Now, go to the main document where you defined the observer:
This is your current code:
<script>
...
function myRegionCallback(notificationState, notifier, data) {
if (notificationType == "onPreUpdate")
alert(regionID + " is starting an update!");
else if (notificationType == "onPostUpdate")
alert(regionID + " is done updating!");
}
</script>
<link href="css/thickbox.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">

Spry.Data.Region.addObserver("ddetail", MyRegionCallback);
</script>

4.- We can simplify things a bit; Since we are only interested in the moment
when the region is finished, we'll replace the callback function with an
region observer object:

<link href="css/thickbox.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">

</script>

HTH
Andres Cayon
Spain Adobe Dreamweaver User Group
http://www.dwug.es
----------------------

"rlcigars" <webforumsuser@macromedia.com> escribió en el mensaje de noticias
news:ghp9hh$n1a$1@forums.macromedia.com...
> I've been working with a spry dataset on a project that I've recently
> added
> Thickbox to. Once I've added the 2 required js script files to the header,
> the
> dataset stopped displaying any data.I found a detailed thread about this
> very
> problem in the forums, but all the combinations of adding an observer to
> my
> spry dataset haven't helped at all. Here is the code of the latest
> attempt -
> anyone see where I went wrong?
>
> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
> " http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
> <html xmlns=" http://www.w3.org/1999/xhtml"
> xmlns:spry=" http://ns.adobe.com/spry">
> <head>
> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
> <title>Untitled Document</title>
> <script src="SpryAssets/xpath.js" type="text/javascript"></script>
> <script src="SpryAssets/SpryData.js" type="text/javascript"></script>
> <script src="scripts/jquery.js" type="text/javascript"></script>
> <script src="scripts/thickbox.js" type="text/javascript"></script>
> <script>
> ...
> function myRegionCallback(notificationState, notifier, data)
> {
> if (notificationType == "onPreUpdate")
> alert(regionID + " is starting an update!");
> else if (notificationType == "onPostUpdate")
> alert(regionID + " is done updating!");
> }
>
> </script>
>
>
> <link href="css/thickbox.css" rel="stylesheet" type="text/css" />
> <script type="text/javascript">
> 
> Spry.Data.Region.addObserver("ddetail", MyRegionCallback);
>
> </script>
>
>
> </head>
>
> <body>
> <div id="ddetail" spry:region="dsCalendar">
> <table width="982">
> <tr>
> <th width="169"><div align="left">Company</div></th>
> <th width="140"><div align="left">Appointment Date</div></th>
> <th width="127"><div align="left">Appointment Time</div></th>
> <th width="153"><div align="left">Number</div></th>
> <th width="70"><div align="left">Caller ID</div></th>
> <th width="108"><div align="left">Last Called</div></th>
> <th>edit</th>
> </tr>
> <tr spry:repeat="dsCalendar">
> <td>{company}</td>
> <td>{app_date}</td>
> <td>{app_time}</td>
> <td>{number}</td>
> <td>{clid}</td>
> <td>{last_called}</td>
> <td><a href="DNUsingledetail.php?id={id}">edit</a></td>
> </tr>
> </table>
> </div>
>

Report · Dec 13, 2008

Thanks for the response Andres, but I've trying to work with it for the past week and I can't follow what you're saying. I don't follow what you're saying in 1 - is that the code I'm using to replace lines 14 to 16, or adding to those lines?

Report · Dec 15, 2008

The idea is commneting the whole function call to avoid thickbox to init byu
itself (it must be hte region observer the one in charge of doing that):

So, starting at line 12 in thickbox.js, you will find this:
//on page load call tb_init
$(document).ready(function(){
tb_init('a.thickbox, area.thickbox, input.thickbox');//pass where to apply
thickbox
imgLoader = new Image();// preload image
imgLoader.src = tb_pathToImage;
});

Now, you can simply comment it:
/*
$(document).ready(function(){
tb_init('a.thickbox, area.thickbox, input.thickbox');//pass where to apply
thickbox
imgLoader = new Image();// preload image
imgLoader.src = tb_pathToImage;
});
*/

And after that, just copy the 3 lines of code inside the curly braces and
use them in the observer function (see point #4 in my previous post)

--
Andres Cayon
Spain Adobe Dreamweaver User Group
http://www.dwug.es
----------------------

"rlcigars" <webforumsuser@macromedia.com> escribió en el mensaje de noticias
news:gi2b84$bdk$1@forums.macromedia.com...
> Thanks for the response Andres, but I've trying to work with it for the
> past
> week and I can't follow what you're saying. I don't follow what you're
> saying
> in 1 - is that the code I'm using to replace lines 14 to 16, or adding to
> those
> lines?
>