Checkbox as radio button
-
We've all seen this before, but it never ceases to amaze me.
Go to: http://www.internetretailer.com/renewal/
Take a look at the questions with the checkboxes. You can only select on at a time.
To accomplish this there is : onClick="radio(this); on each checkbox. That function is:
function radio(c)
{
var cg=document.freesubscription.elements[c.name];
if (c.checked)
{
for (idx=0;idx<cg.length;idx++)
{
if (cg[idx].value != c.value)
{
cg[idx].checked=0;
}
}
}
}It's all functional, but have they never heard of type=radio? You would think that InternetRetailer would at least have a clue.
-
Just turn off javascript, check all the boxes, submit the form, and see what happens
-
@nucleoid said:
Just turn off javascript, check all the boxes, submit the form, and see what happens
To ruin the fun, you get "We are sorry, an error has occured. Please try again....."
-
Well, at least errors are trapped
-
I was actually forced to code something like this once.
My boss at the time wanted checkboxes to act like radio buttons and I argued, stating UI standards, coding problems, issues with re-wiring current control functionality, rebuilding the wheel when we had one right there, etc...
In the end he would budge, trying to state that everything I said was wrong regardless of the proof. I finally told him that I knew I was right but if he wanted it that way just because he wanted it that way say so, he did and I conceded. There is no winning that battle.
So we set a junior programmer on it for 2 weeks and still didn't have a working implementation so it got handed to me and I did it in a day. A week after my so called boss got fired I went in and ripped out the javascript and put radio buttons in place.
-
There is one legit use to this, but it's more like a workaround
Once you select something in a radio group button, you can't deselect it. I think this is what they are trying to solve.
Edit: Of course, in this case is useless, because they require you to select one, so they are using it exactly as a radio group.
-
I think this is actually pretty common. I think it even been brought up on this site a few times. My only guess is that these managers like the "look" of check boxes or radio buttons. This, coupled with the fact that they don't understand that following conventions is a good thing, leads to crap like this.
In fact, I think pretty much any time you need to come up with your own type of GUI control you're probably on the wrong path. I remember a project where a developer worked for a few weeks on a drop-down control, except you could select multiple values. Each value in the drop-down had a checkbox next to it, indicating that it's selected. It kind of worked, but when the drop-down part was closed (i.e. it shrinks back down to 1 line), only the first choice would be visible; You couldn't tell what was selected without opening the drop-down again and scrolling through the (hundreds) of options. I tried to tell them that there was already a control that was built for this purpose, the List Box (JList in Java), but the managers just liked the look of drop-down combo boxes.
-
@Masiosare said:
Once you select something in a radio group button, you can't deselect it. I think this is what they are trying to solve.
That's still more easily solved with a drop-down list.
-
@bstorer said:
@Masiosare said:
Once you select something in a radio group button, you can't deselect it. I think this is what they are trying to solve.
That's still more easily solved with a drop-down list.Or more commonly, provide a radio button with the text "None" and make that the default. This gives the user the means to use the controls as designed and also have all the options necessary.
-
@Outlaw Programmer said:
My only guess is that these managers like the "look" of check boxes or radio buttons.
I have one possibly legitimate reason to prefer checkboxs (that isn't to say that I prefer using them improperly), the hit area on many radio button implementations is small and hard to identify visually. I've always thought that the computer 'radio button' looked more like the visual feedback (a painted circle moving under a hole) than the actual 'radio button', which (for those who possible have never seen them) is something more like the traditional button control.
-
@KattMan said:
provide a radio button with the text "None" and make that the default.
Sadly lacking in most of the survey's I've completed recently. For example:
You get TV (1) teresstrial (2) cable (3) satellite (4) extra terestrial.
Um, (5) TV is crap in this country, so I don't own one and abuse friends', local, ...
No 'none of the above', or
'no'
There appears to be no way of indicating to these people that advertising via TV is a crap way of making money.
Oh... Cross-thread to AdBlock....
-
@arty said:
I have one possibly legitimate reason to prefer checkboxs (that isn't to say that I prefer using them improperly), the hit area on many radio button implementations is small and hard to identify visually.
That's why (if the programmer / web developer) has done it right, you're supposed to also be able to click on the radio button's label to select it. Really annoying when webpages with radio buttons don't have <label> </label> tags around the text.
-
Hmm, didn't know there was a builtin way to do it on web pages. Now that you mention it, I see that the windows common controls were updated to do the same, too.
-
IIRC, they did it back in the 90s when I was playing with VB3
-
I remember my boss wanting the same thing. After the arguing, he said "I value your input, I want people to check the option they want, and I want a picture of a tick to appear once they have checked it. If you can do that with your so-called 'radio buttons', then do it."
Since everything had to be done urgently, top priority, yesterday, etc, I just gave in and used checkboxes.
-
Hmm... if asked to do that I might try this:
First not argue, that gives them less chance to be specific that they want to use square ticks instead of round dots. That's actually the critical part of the plan really. I'd act like it's an amazing leet challenge and I want to see if I just might be able to bend the system to do that.
Then, put checkboxes into the html code, but write some js to replace them with radio buttons after a short but noticeable delay, and spend some time doing it, basically give the impression of a lot of hard work. Maybe even make them all change sequentially, and also obfuscate the fuck out of the code and comment/name it to give the impression I'm hacking the innards of internet explorer, without actually claiming to be doing so. The impression is that I managed to come up with a way for checkboxes to act exactly like radio buttons.
Then present it, all grinning and pleased with my achievement, this is what my hours of hard work have achieved... all those paid man-hours for this. Obviously then they'll come clean that they actually wanted square ticks.
At this point I will be inhaling through my teeth. Man, that's gonna be tricky, the system's not meant to work like that...
-
@arty said:
@Outlaw Programmer said:
My only guess is that these managers like the "look" of check boxes or radio buttons.
I have one possibly legitimate reason to prefer checkboxs (that isn't to say that I prefer using them improperly), the hit area on many radio button implementations is small and hard to identify visually. I've always thought that the computer 'radio button' looked more like the visual feedback (a painted circle moving under a hole) than the actual 'radio button', which (for those who possible have never seen them) is something more like the traditional button control.
Typically the label that accompanies a checkbox can be used to check it as well. In HTML, if you wrap your input tag in a label tag, you can style that label to be much larger than the radio itself. I've used it recently to make icons that accompany radio buttons part of the radio selection itself. Similar stuff can be done in winforms as well.
-
@KattMan said:
My boss at the time wanted checkboxes to act like radio buttons and I argued, stating UI standards, coding problems, issues with re-wiring current control functionality, rebuilding the wheel when we had one right there, etc...
+1 for fighting the good fightIn the end he would budge, trying to state that everything I said was wrong regardless of the proof. I finally told him that I knew I was right but if he wanted it that way just because he wanted it that way say so, he did and I conceded. There is no winning that battle.
So we set a junior programmer on it for 2 weeks and still didn't have a working implementation so it got handed to me and I did it in a day. A week after my so called boss got fired I went in and ripped out the javascript and put radio buttons in place.
+1 for knowing when the battle's lost.
+10 for doing it right once the guy was out the way.
-
cg[idx].checked=0;
Small detail is the fact that checked should be a boolean.
-
@dhromed said:
cg[idx].checked=0;
Small detail is the fact that checked should be a boolean.
False is the same as 0 in JS (as well as many other languages.) alert(false == 0) will show "true".
Sure, it doesn't make sense to use 0 when you could use false, but it's not wrong.
-
The first I noticed was the use of "onClick" instead of "onclick", which immediately gave away the quality level of the coder.
-
@pinkduck said:
I know! It means they probably started coding this stuff back before the anyone gave a shit about the W3C standards. So they've clearly got experience.The first I noticed was the use of "onClick" instead of "onclick", which immediately gave away the quality level of the coder.
-
onClick is perfectly legal, as is ONCLICK, ONclIck, or whatever combination (unless it's a xhtml document, that it's not.)
I'm more worried at the lack of a doctype, and use of ancient stuff such as font tags.
-
@KNY said:
Sure, it doesn't make sense to use 0 when you could use false, but it's not wrong.
It would on ultra-high volume pages, like Google's. That extra 4 characters could amount to a few giga- or tera-bytes a year. Of course, Google's got enough pipe they'd never notice the extra $10 on the bandwidth bill, but it would add 0.0001 seconds to page load time for everyone. They're pretty obsessive about minimizing load times.
-
Gah! I found the opposite in an application at work today.
There was a label "Grant until", with a selected radio button labelled "Unlimited" and a disabled text box labelled "Days".
The Unlimited radio button behaved like a checkbox, and when 'undotted', enabled the text box.
Aaaaaaargh!
-
@Outlaw Programmer said:
In fact, I think pretty much any time you need to come up with your own type of GUI control you're probably on the wrong path. I remember a project where a developer worked for a few weeks on a drop-down control, except you could select multiple values. Each value in the drop-down had a checkbox next to it, indicating that it's selected. It kind of worked, but when the drop-down part was closed (i.e. it shrinks back down to 1 line), only the first choice would be visible; You couldn't tell what was selected without opening the drop-down again and scrolling through the (hundreds) of options. I tried to tell them that there was already a control that was built for this purpose, the List Box (JList in Java), but the managers just liked the look of drop-down combo boxes.
At my previous job, one of our applications had a lot of editable combo boxes for data entry. The customer didn't like them for some reason, and they wanted us to replace them with text fields that showed a popup menu on right-click with the choices. We tried to talk them out of it (we should follow UI standards, etc.), but they didn't care. We got out of it by giving them a ridiculous time estimate (with associated cost), and they decided it wasn't worth it.
-
The proper response to that in my office is, "That'll cost a lot extra." (Since time is money, after all).
Of course, if your boss is the type that'll make you eat that sort of costs, my condolences...
