radio button event: onUnCheck()

[dlite922]

I have a few radio buttons. One of them should enable a (date) field if checked, while all others should not care about this field at all.

When this radio button is checked, the date field should be enabled. I've done this and works. How I'm doing it is calling a function using onClick(). then if the status if the radio button's check is true, I enable the field. (This is because I don't want every click to enable it, such as a click to uncheck the radio button).

The problem:
If one of the other radio buttons are selected, I want the date field to be disabled WITHOUT having to add an onclick() to the rest of them to disable it.

// What I want: 
<input type="radio" name="one" onclick="enableDate()" onuncheck="disableDate" />
<input type="radio" name="two"  />
<input type="radio" name="three"  />

// What I don't want to do: 
<input type="radio" name="one" onclick="enableDate()" />
<input type="radio" name="two"  onclick="disableDate()" />
<input type="radio" name="three"  onclick="disableDate()" />

of course onuncheck event doesn't exist. so I have to call a disableDate() function on the last two.

Why I don't like this solution:
Just basic programming standards. Why should the radio buttons be tied, or in this case "clean up after each other".


If you have any thoughts, please share,

thanks,




PS: Feel free to move this or copy this to the JavaScript forum too.


Dan

[zorgi]

Hi Dan

I am bit confused with the way you use your radio buttons. Basically because they all have different names is impossible to deselect any of them once selected. Is this the way you wanted it or just typing error?

[Dormilich]

something like: if (checked) enable(); else disable(); ? but I agree with zorgi, if you don’t have at least two radio buttons with the same name, it’s hard to uncheck a radio button.

[zorgi]

I know it would probably be total overkill to do this, but if you really like "Unobtrusiv e JavaScript" (I do) than jQuery does it and your HTML could be totally clean. So if your form is like this:

<form>
<input type="radio" name="a" value="1"/>
<input type="radio" name="a" value="2"/>
<input type="radio" name="a" value="3"/>
</form>

You wouldn't have to add anything to it and your function could be something like this:

$(function(){
		   $("form > input[name='a']").click(function(event){
											if(this.value == 1){
													enableDate(); // or write enabling code here
												}else{
													disableDate(); // or write disabling code here													
												}
											});
		   })

[dlite922]

Yes! Zorgi's jquery is to my programming standard and looks clean.

I've been working with jquery with this calendar widget and I'm very very interested to learn it if I can find the time. I seem to understand all jquery code, but i've yet to code anything completely mine.

Thanks alot!



Dan