First, you don't really need 2 functions for this.
Code:
function toggleSpec(objId, cmd) {
var _myObj = document.getElementById(objId);
var _myTableObj = document.getElementById((_myObj.parentNode.id).substring(0,(_myObj.parentNode.id).indexOf('_')));
if (cmd == "hide" || _myTableObj.style.display != 'none') {
_myTableObj.style.display = 'none';
_myObj.parentNode.innerHTML = '<a href="#" onclick="toggleSpec(objId,\'\'); return false" title="Hide Details"><img src="images/hide_details.gif" width="68" height="9" alt="" border=0></a>';
}
if (cmd == "show" || _myTableObj.style.display == 'none') {
_myTableObj.style.display = 'block';
_myObj.parentNode.innerHTML = '<a href="#" onclick="toggleSpec(objId,\'\'); return false" title="See Details"><img src="images/see_details.gif" width="68" height="9" alt="" border=0></a>';
}
}
The function can now be controlled in two ways. Either with or without the cmd argument filled in. If the cmd argument is empty, the function will look at the elements status and toggle it. If the cmd argument isn't empty then the function will 'override' the elements status and do with it whatever the cmd argument says.
(I hope that makes sense to you  ).
Next, you'll have to change the way the function is called. We changed thei arguments of the function, so we'll have to make the proper adjustments to every line of code that calls the function.
Code:
onclick="toggleSpec('specialsID1_Div',''); return false"
And change the first argument to reflect the id of the DIV it is contained in.
To toggle all divs, create an extra function that will receive all of the id's that need showing or hiding via arguments and then for every id call the toggleSpec function.
Be sure to use the cmd argument to override the current elements status.
At the end of this extra function, you can change the calling link, just like you do in the toggleSpec function.
Last edited by Oneway : 01-09-2007 at 03:37 PM.
|
