Page 1 of 1

onclick with more than 1 function called.

Posted: Wed Aug 11, 2010 10:26 am
by aravona
Im working with a wordpress plugin which is called xcollapse (collapsible elements) which works fine, however it is required to add to this a snipped of code which changes the text of a link as it is clicked.

The code I've found to do this works brilliantly, however I cannot get the two codes to work together and they both need an onClick. I thought of making a function to do both, however I've hit a snag as the xcollapse uses an ID to show which element is to be collapsed.

The change text code:
[text]oldTextAry = new Array();

function changeText (fieldObj, newTexStr) {
if (newTexStr == fieldObj.innerHTML) {
fieldObj.innerHTML = oldTextAry[fieldObj.id];
} else {
oldTextAry[fieldObj.id] = fieldObj.innerHTML;
fieldObj.innerHTML = newTexStr;
}
}
[/text]

Code for the xcollapse:
[text][function xcollapse(id)
{
var ccommid = document.getElementById(id);
if(ccommid !== null) {
if(ccommid.style.display == 'block') {
ccommid.style.display = 'none';
}
else { ccommid.style.display = 'block';
}
}
}[/text]

The link I need it to go in:

<a onclick="xcollapse('X1492');return false; changeText(this,'+ E-BOOKS, DVDs, CDs & DOWNLOADS (Click to hide)');" style="font-size:12px; padding-left:8px; padding-top:9px; background-color:#897c67; color:#FFFFFF; display:block; height:25px;" href="#" id="text1link">+ E-BOOKS, DVDs, CDs & DOWNLOADS (Click to expand)</a>

(red is the change text, blue is the collapse)

Any hints on getting the two to work together? :)

Kind regards,

Aravona

Re: onclick with more than 1 function called.

Posted: Wed Aug 11, 2010 12:55 pm
by PHPHorizons
Hello aravona,

It sounds like you need to make a wrapper function. In the onlclick attribute, call that wrapper function as follows:

Code: Select all

onclick="aWrapperFunction(this)"
Then, somwhere on the page in your javascript add a function like this:

Code: Select all

function aWrapperFunction(event_context) {
   // event_context === this
   // call the two functions that you need to call here
   ....
}
Cheers

Re: onclick with more than 1 function called.

Posted: Wed Aug 11, 2010 4:18 pm
by John Cartwright
I would probably create a wrapper function, however, it is not neccesary.

In your code,

Code: Select all

<a onclick="xcollapse('X1492');return false; changeText(this,'+ E-BOOKS, DVDs, CDs & DOWNLOADS (Click to hide)');" 
the event is terminated once it reaches the return, which cancels the bubble. Therefore, by simply moving the return statement after both functions, it should work as expected.

Code: Select all

<a onclick="xcollapse('X1492'); changeText(this,'+ E-BOOKS, DVDs, CDs & DOWNLOADS (Click to hide)'); return false;" 

Re: onclick with more than 1 function called.

Posted: Thu Aug 12, 2010 3:15 am
by aravona
Thanks, that does let the code run ^^ however its not changing back anymore ...