HOW TO call Javascript when radio is checked?

[Tea_J]

Hi guys

What im doing here is im trying to toggle some content based on radio button selection..

options are:

PAY IN CASH (RadioButton here)
PAY VIA CHECK (RadionButton here)

and if pay via check show the following table:
Check Number: (textField Here)
Bank/Branch: (textField here)

im using this extension:
http://www.neonix.net/dreamweaver_extensions/neonix_toggle_content/neonix_toggle_content.htm

it's really neat.. and it works perfectly fine.. but it uses a LINK to toggle the content..

I simply copied the java script it was calling in the link... and put it on my radion button.. works alrite but....

i cant' seem to make it work the way it should.. i've tried onClick, onFocus, onSelect, onChange..

I get problems like, clicking on one radio button twice toggles the content on and off.. i have similar problems with other event methods..

for example

<input name="payment_method" type="radio" onChange="MM_callJS(neonixToggle('checkInfo_TGContent','checkInfo_TGLink','',true))" value="cash" checked>

see the problem here is this would be perfect if i only had 1 radio button.. but since i have more than 1, i need to find a way to call javascriipt ONLY if RADION BUTTON is checked/selected

any ideas?

[JPnyc]

You mean only if EITHER of them is selected?

[Tea_J]

You mean only if EITHER of them is selected?

no.. more like... kinda like.. onChange.. coz i start out with one of the radio's selected.. so if the user ticks the 2nd radio button, the state of the first radion button has changed, hence calling the script... and if the user ticks the first one, it changes the status of the 2nd button.. again, calling the script..

in fact, i can just set the ON CHANGE behavior on one button.. since there's only 1 javascript action which either toggles the hidden content on or off... so i just need to keep calling that every time the state of the radio's changed.. BUT.. how do i do that? the onChange event doesnt seem to work right..

[JPnyc]

Then you need to call the function onChange of either button, and you need to test for which is selected. Right now, you're just calling the function onchange, but you're not testing for which of them is selected. That's why you get the unpredictable results and not what you're looking for. You need to add some statement like

if(document.forms[0].chkBoxName.checked)

You only need test for the 1st one though, because if the 1st one's checked, the 2nd isn't and vice versa. So then whatever you want to happen when the 2nd one is selected goes in your else statement. Is that too vague?

[Tea_J]

not really vague..i do get what you mean and i think that's what i need.. but.. HOW!? hehehe.. im not a javascript guy... hence.. me using the widgets..

[JPnyc]

Well I'm sorry but I don't know a thing about Dreamweaver. I've never even opened the program. I've seen the code it puts out though. Reading it gives me a headache usually. But basically it'll look like this and call this function onchange of both radios:

function checkEm() {

if(document.forms[0].nameOfFirstRadio.checked) {
//stuff you want to happen if the 1st is checked
}

else {
//stuff you want to happen if the 2nd is checked
}}

That assumes there's only 1 form. If there's more than one, you need to tell me which one. IT also assumes the radio button (1st one) was given a name.

[Tea_J]

i see.. hmm... though i dont code in js, i do understand what the script does...

i think it will have a bit of problem since im just calling 1 js function generated by my toggle content widget..

There is one js to call right now, and it's the toggle content script, which has no option to toggle the content ON or OFF.. it's just that every time yuo call the js function, it kinda SWITCHES the state.. on if it's off, and off if it's on..

so.. i think i'll have the same problem.. unles.. hmm.... how do you propose i call the checkEm() function? from the radio button? onClick?

Well I'm sorry but I don't know a thing about Dreamweaver. I've never even opened the program. I've seen the code it puts out though. Reading it gives me a headache usually.

haha. tell me about it.. but it's just not worth it anymore to hard code an html website.. i can do in DW things faster that would normally take much longer in hard coding.. not to mention the time spent on scrolling up and down on just a few tables in your website. i left html hard coding years ago.. and just got used to dreamweaver's messy codes .. so if there's a tweak i need to do, i just do code surgery every now and then.. ... also, at least dreamweaver's codes are way cleaner than frontpage! i mean daumn!!! hehe.. u seen frontpage codes? sheesh..

[JPnyc]

You can call it onclick, sure. That's best probably. Can you tell me very simply: 1)what exactly should happen when the 1st is clicked

2)what should happen when the 2nd is clicked?

I can probably solve this for you with a lot less code than Dreamweaver will use.

[Tea_J]

1)what exactly should happen when the 1st is clicked

(toggle content) table with table ID "moreInfo" is hidden

2)what should happen when the 2nd is clicked?

(toggle content) table with table ID "moreInfo" is shown

simple as that.. lol

I can probably solve this for you with a lot less code than Dreamweaver will use.

ahh yes.. the spirit of a hard coder. 🙂

[JPnyc]

LOL, yep, that would be me 🙂. Ok, here goes. Remove whatever javascript DW put into the page for you. Just get all of it, and the script tags and the function call, out. And inside the 1st radio tag put:

onclick="document.getElementById('moreInfo').style.visibility='hidden';"

Inside the 2nd radio tag put:

onclick="document.getElementById('moreInfo').style.visibility='visible';"

Bang, you're done.

[Birmingham]

but is the "onclick" method accessible to non mouse users?

[bradgrafelman]

Birmingham wrote:

but is the "onclick" method accessible to non mouse users?

Yes, because even if you use keystrokes (ex. tab to the checkbox/radio/etc. and hit spacebar to select it), your browser should simulate a mouse click.