I have this line in my PHP file:

echo "<input type='button' id='showButton' value='show'  onclick='showOld()'>";

The button is displayed but when it is clicked, nothing happens.

The function is located in an external JS file. this is function declaration:

Other onclick events and JS functions in the page are working.

function showOld()
{
alert("njkh");
var table = document.getElementById("showExp");
var button = document.getElementById("showButton");
if (table.style.display == "none")
{
    table.style.display = "inline";
    button.value = "הסתר ניסויים ישנים";
}
else if (table.style.display == "inline")
{
    table.style.display = "none";
    button.value = "הצג את כל הניסויים";
}       
}

console says:

"ReferenceError: showOld is not defined"

I have this line in my PHP file:

echo "<input type='button' id='showButton' value='show'  onclick='showOld()'>";

The button is displayed but when it is clicked, nothing happens.

The function is located in an external JS file. this is function declaration:

Other onclick events and JS functions in the page are working.

function showOld()
{
alert("njkh");
var table = document.getElementById("showExp");
var button = document.getElementById("showButton");
if (table.style.display == "none")
{
    table.style.display = "inline";
    button.value = "הסתר ניסויים ישנים";
}
else if (table.style.display == "inline")
{
    table.style.display = "none";
    button.value = "הצג את כל הניסויים";
}       
}

console says:

"ReferenceError: showOld is not defined"

• javascript
• dom-events

• Maybe some of the Javascript is wrong. I can't see anything wrong in the HTML. Please post the JS code as well. Or make a fiddle at jsfiddle.com – Akos Commented Aug 30, 2011 at 7:23
• 6 Edit the question to add your JavaScript code for the function showOld(). – Shef Commented Aug 30, 2011 at 7:23
• 1 Where is the external JS file included? It should be included before the input button so that the function is available. Also check your spelling. If you have Firefox with Firebug, open the console and refresh to see if any exceptions show up. – T. Junghans Commented Aug 30, 2011 at 7:26
• 1 @TJ - this is not correct. showOld() will not be called or referenced until clicked (because it's passed as a string that won't be evaluated until the click) so it does not have to be before the input button. – jfriend00 Commented Aug 30, 2011 at 7:32
• problem solved when i moved declaration from the bottom to different location inside the JS file (???). nevertheless on IE i still get "Object Error" message – itamar Commented Aug 30, 2011 at 9:22

4 Answers 4

you must make sure your updated code had been deployed.

you can check the html source .

and your posted code has no any problem.

Try opening up firebug's console (or chrome dev tools) and check for any script errors.

You should avoid writing inline javascript. It makes it harder to debug and maintain your codebase. I recommend that you read the following articles on javascript events:

Quirksmode - Early Event Handlers

Quirksmode - Traditional event registration model

A quote from the article:

Although the inline event registration model is ancient and reliable, it has one serious drawback. It requires you to write JavaScript behavior code in your XHTML structure layer, where it doesn't belong.

First, simplify the problem, see if the following function works.

function showOld() {
alert('test');
}

Try next to check for exceptions:

<input type='button' id='showButton' value='show' onclick='javascript:alert(1);try{showOld()}catch(e){alert(e)}' />

And what exactly is displayed in the javascript console (if available)?