Hi,
> Do
> you think it's some weird problem caused by adding elements after the
> DOM was loaded?
No, people do that all the time.
I'm not immediately seeing the problem, I think it's probably in the
markup or code outside what you quoted. But some things to look for:
1. Unless you're intentionally using `catObj` as a global, you'll want
to declare it in the function (there's no `var` that I see). Otherwise
it becomes an implicit global, which is so high on my list of Bad
Things(tm) I blogged about it[1] (which I don't often do).
2. IE has issues with conflating the namespaces of the `id` and `name`
attributes, which should be separate. I see you're using IDs for the
things to show/hide (perfectly normal, that). Is there *anything* on
your page that has _either_ an `id` or a `name` with the value you're
providing to `toggleSubCats` other than the element you're trying to
show/hide? For instance, if you have a 'stuff' input field:
<input name='stuff' type='text'>
and then later in the document a 'stuff' div:
<div id='stuff'>....</div>
...on IE, document.getElementById('stuff') will get you the input
field element rather than the div, despite that being perfectly valid
HTML markup. It's wrong, but that's the way it is, so it's worth
looking whether that might be an issue.
[1] http://blog.niftysnippets.org/2008/03/horror-of-implicit-globals.html
HTH,
--
T.J. Crowder
Independent Software Consultant
tj / crowder software / com
www.crowdersoftware.com
On Mar 15, 11:28 pm, David Behler <d.beh...@gmail.com> wrote:
> Hey folks,
> maybe you can help me out with this.
>
> I got a simple function that I use to load sub-categories when clicking
> on a parent category:
>
> function toggleSubCats(cat, id)
> {
> /* Vars and stuff */
> catObj = $(cat);
> var send=null;
>
> /* Now figure out the status of the element and open or close based
> on what's found */
> if( catObj.getStyle('display') == 'none') {
> catObj.setStyle({display : 'block'});
> } else {
> catObj.setStyle({display : 'none'});
> return;
> }
>
> /* Let's first dump a loading image in the target div then send the
> AJAX request */
> catObj.update("<img src='" + base_images + "loading_small.gif' />");
> var url= base + 'galleryback/showSubCat/'+id;
>
> new Ajax.Updater(catObj,url);
>
> /* Alternative to Ajax.Updater() call
> new Ajax.Request(url, {
> method: 'get',
> onSuccess: function(transport) {
> $(cat).update(transport.responseText);
> }
> });
> */
>
> }
>
> All it's supposed to do, is to get the element (in this case a div)
> with the id submitted in the cat parameter and display/hide it. If
> display is set to block, then an loading image is shown and ajax.updater
> is called to load the sub-categories to the higher category (id parameter).
>
> This works fine in FF3.6, Chrome and Safari, but in IE8 the loading
> image is not replaced with the loaded sub-categories. If I replace the
> Ajax.Updater call with an Ajax.Request call (see commented section below
> Ajax.Updater) it does not work either in IE8, but I can alert the
> responseText and the catObj.update() does not raise an error, it just
> doesn't have any effect.
>
> Not sure this is important but here is another info that might help you
> solving this:
> On intital loading of the page I display only the top categories,
> clicking on one of them calls the above shown function and displays the
> child categories. But clicking on one of the loaded child categories,
> it's where the problem starts and it does not work anymore in IE8. Do
> you think it's some weird problem caused by adding elements after the
> DOM was loaded?
>
> I really hope you can help me with this!
>
> Thanks in advance,
>
> David
--
You received this message because you are subscribed to the Google Groups
"Prototype & script.aculo.us" group.
To post to this group, send email to prototype-scriptacul...@googlegroups.com.
To unsubscribe from this group, send email to
prototype-scriptaculous+unsubscr...@googlegroups.com.
For more options, visit this group at
http://groups.google.com/group/prototype-scriptaculous?hl=en.
