CODEWITHSUNDEEP
javascript
William
William

Reputation:

OnClick does not work

this code does not work? When i try to click on the radiobutton, nothing happens. It is supposed that it is going to be disabled but nothing is disabled and enabled. Here is the code.

<script type="text/javascript">

function ann() 
{
document.getElementById('butta').disabled = true;
document.getElementById('strup').disabled = true;
document.getElementById('name').disabled = false;
}


function own() 
{
document.getElementById('butta').disabled = false;
document.getElementById('strup').disabled = false;
document.getElementById('name').disabled = true;
}

</script>


<input type="radio" name="checktype" id="ann" onclick="ann()" value="1"> Anime<br>
<input type="radio" name="checktype" id="own" onclick="own()" value="2"> My picture<br>

Upvotes: 0

Views: 3637

Answers (5)

Russ Cam
Russ Cam

Reputation: 125538

It Works fine

add /edit to the URL to inspect the code and play around.

I closed the input and break elements in the example. Although the code works without these, I would consider it good practice to close them.

EDIT:

Updated example

This is to demonstrate that the code does work when you have a <select id="name">, <input type="file" id="strup" /> and <input type="button" id="butta" /> in the page. Works fine in Firefox 3 and IE 7.

There must be a problem elsewhere in the code

Upvotes: 1

jhurshman
jhurshman

Reputation: 6067

I think that the problem is that your IDs and your functions have the same name. Some browsers put HTML node IDs as properties into the global JavaScript scope. In such browsers, ann is basically the same as document.getElementById('ann').

Try renaming either your IDs or your functions so they do not share the same name. Something like this:

function annClick() 
{
document.getElementById('butta').disabled = true;
document.getElementById('strup').disabled = true;
document.getElementById('name').disabled = false;
}


function ownClick() 
{
document.getElementById('butta').disabled = false;
document.getElementById('strup').disabled = false;
document.getElementById('name').disabled = true;
}

</script>


<input type="radio" name="checktype" id="ann" onclick="annClick()" value="1"> Anime<br>
<input type="radio" name="checktype" id="own" onclick="ownClick()" value="2"> My picture<br>

Upvotes: 0

Andrejs Cainikovs
Andrejs Cainikovs

Reputation: 28474

This code is working!

1. Objects you are referencing to from functions are non-existent: butta, strup, name. Most possible, you have objects with this names, not id's. This is often mistake.
2. If you are unable to get javascript working at all this means only one - you may have syntax error somewhere.

One advice for future - use Firefox with Firebug add-on. This will save you your precious time.

Upvotes: 1

chaos
chaos

Reputation: 124365

That code is fine. Check the Firefox error console (Ctrl+Shift+J) when the page loads for possible sources of problems that might interfere with your functions being defined, and check it again after you've clicked on one of your radio buttons. If this isn't educational, try adding alert()s to ann() and own() so you can determine for certain whether they're being called at all.

Upvotes: 0

DanDan
DanDan

Reputation: 10562

Your ids for the radio buttons are wrong.

Upvotes: 4

Related Questions