Javascript - HELP!!

[objelland]

Hi

I am trying to write a javascript that shows and hides text.
Take a look at http://www.landsnett.no/modules.php?mod=checkout and click on the second questionmark from the top. As you can see the text appears. The thing is that I must click on the same questionmark to hide the text. What I would like to do is to hide the text when clicking on any other of the questionmark images, plus that the text belonging to the questionmark clicked appears.
I have tried to do this using the following script:

<script language="JavaScript">
{literal}
<!--//
function GetInfo(container)
{
var show = document.getElementById('container' + container);
show.style.display = "block";//show selected info
var containers = new Array();//initialize array
{/literal}
{foreach from=$cat_data item=item}
containers.push({$item.id});//add each to the end of array
{/foreach}
{literal}
for (var i=0; i<containers.length; i++) { //loop through array and hide all but show
var idContainer = 'container' +  containers[i];
if (idContainer != container) {
document.getElementById(idContainer).style.display = "none";
}
}
}
//-->
{/literal}

The HTML looks as follows:

{html_table_adv loop=$cat_data cols=$cols table_attr='width="100%"'}
<a id="moreLink" href="#" onClick="GetInfo('container[[id]]');">
<img src = "templates/meldinn/images/help.png" border="0" alt="Info"></a>
<div id="container[[id]]" style="display:none">[[description]]<br></div>
{/html_table_adv}

Can anyone see what's wrong? What happens is that when a quesionmark "button" is clicked on, the link is directing to the home page of my site.

I really appreciate any help here guys!

Regards
Oyvind

[Eric Barnes]

I think your html needs to look like this:
{html_table_adv loop=$cat_data cols=$cols table_attr='width="100%"'}
<a id="moreLink" href="#" onClick="GetInfo('1');">
<img src = "templates/meldinn/images/help.png" border="0" alt="Info"></a>
<div id="container1" style="display:none">[[description]]<br></div>
{/html_table_adv}

[Mike-N-Tosh]

I don't really know javascript. I'm more of your copy and paste, but I use jquery and the jQpanels plugin to do that with.

jqpanels

It's the accordion style. I've modified some of his code for my needs from time to time.

Hope that helps,
-Mike

[objelland]

Hi guys, thank you for you reply.

Eric: When I tested your code the text shows for like half a second and then I am directed to the home page. Strange!?!
Take a look at http://www.landsnett.no/modules.php?mod=checkout and check it out.
Any idea what might cause this?

Oyvind

[Eric Barnes]

Try changing the link to this:
<a id="moreLink" href="javascript:void(0);" onClick="GetInfo('1');">

[Eric Barnes]

On a side note you might want to check your email as we are getting returns from the one entered here on the forums.

[objelland]

Sorry for the e-mail thing, I have now updated it.
The script does not work. It shows the text, but the image dissapears and non of the other images (buttons) works after clicking on one of them.
Hmmm.... I am not a javascript guru and I don't know what to look for at this stage.

Oyvind

[Eric Barnes]

I just had a look and I think this is your issue:

<a id="moreLink" href="#" onClick="GetInfo('4702');">
<img src = "templates/meldinn/images/help.png" border="0" alt="Info"></a>
<div id="container1" style="display:none">

It should be:

<a id="moreLink" href="javascript:void(0);" onClick="GetInfo('4702');">
<img src = "templates/meldinn/images/help.png" border="0" alt="Info"></a>
<div id="container4702" style="display:none">

[objelland]

hi
I have now tried all the possebilities suggested, but with no luck.
The javascript:void(0) suggestion doesn't work either I am afraid.
I am aware that this is not a javascript forum, but I would really appreciate if you have the time to take a closer look.

Oyvind

[Eric Barnes]

Unfortunately I am not the best with javascript either. However if you look at the administration dashboard you will see how I set something similar up. It is the right side links.