I have sort of a general question.
I am making a shopping cart for a project where I am selling electronics. So, for example I am selling an iPhone and a Samsung Galaxy on the same "Phones.aspx" page, and I am assigning one single Radio Button to each. This way, if the customer wants to add the iPhone, they check the iPhone radio button and hit the ADD button under the iPhone to add it to the cart.
I plan to the DataSourceId for RadioButton connected to my ObjectDataSource. My question is, how do I specify in the RadioButton the single ID for the iPhone? I know that using the DataValueField and setting that to Id, will specify all of the Ids for my table. But what property do I use to specify the specific Id for the iPhone, or can I even do that?
With radio buttons, the value property is the one that differentiates within a group of radios. So you may see this:
<input type='radio' id='ID_product' value='iPhone'> iPhone
<input type='radio' id='ID_product' value='Samsung Galaxy'> Samsung Galaxy<br>
<br>
Related
The question consists of two parts:
Is it ok (from the UX/UI p.o.v.) to make a search box on the page activated on the first tab keypress?
How to do it technically keeping the rest of the tabbing mechanism intact (e.g. the first element activated on tab keypress by default is now activated right after the search box on the second tab keypress)?
For the desktop browsers it okay. But bad UX for the mobile browser as it will popup the keyboard focus automatically comes to search box.
Set attribute tabindex="0" for the elements programmatically using JavaScript after the the search box leaves focus. Use onblur() event.
You can use tabindex=1 attribute in your search input element to achieve. Like this,
<input type="text" placeholder="Search here" tabindex="1" />
Whether you should or not, This article might help
I am using bokeh single radio button with single title . Initially it is inactive and when i click on radio button it changed to active but if I click again in active it is not changing to inactive state.
How i need to acheive this functionality??
Whether it's RadioGroup or RadioButtonGroup, neither of those two widgets is meant for a single element usage. Per design they are meant to be used as a group of elements. I advice you to use Toggle for your application. Other alternatives are CheckboxButtonGroup and CheckboxGroup. See Bokeh documentation for specific examples.
I have HTML buttons and want them to not be announced as buttons by the screen reader. Is there a way for it? I am using the button for Rating.
What kind of object would you like it announced as? When you have a "ratings" type object, doesn't the user have to click on it to set the rating? So, for example, if you have 5 possible stars and the user wants to give it a rating of 4 stars, don't they have to click on the 4th star? The act of clicking needs to be conveyed to screen readers too.
Instead of having 5 single "buttons", it could be a radio group with 5 radio buttons. Or I suppose it could be a "slider". But whatever object you think is appropriate, the role of that object needs to be announced so that the screen reader user knows how to interact with it. When a screen reader user hears "button", they know they can press Space or Enter on it to select it. If they hear "radio button" or "slider", they know they can use the arrow keys to change the selection.
I would go with a radio group and radio buttons since your rating will be a mutually exclusive set of X objects that you can only choose one of.
For an example, see https://www.w3.org/WAI/tutorials/forms/custom-controls/#a-star-rating
On Linux would like to have a set of menu items which are mutually exclusive and have the currently selected one be designated by a radio button instead of a checkbox.
Is there a way to do this in Qt v4.4.3 easily?
I believe you would want to use QtActionGroup to group those menu items which should be mutually exclusive. It also makes them look like a radio button when rendered. Smth like this:
QActionGroup* group = new QActionGroup( this );
ui->actionTest1->setCheckable(true);
ui->actionTest2->setCheckable(true);
ui->actionTest3->setCheckable(true);
ui->actionTest1->setActionGroup(group);
ui->actionTest2->setActionGroup(group);
ui->actionTest3->setActionGroup(group);
3 menu items above should be groped together; more details here : QActionGroup Class Reference
Say I have some state which the user can toggle, for example [ON] | [OFF] .
Typically, I use ONE switch (BUTTON) and when the thing is ON, the user sees:
LIGHT IS [ON]
When it is OFF they see
LIGHT IS [OFF]
My question is: is it obvious (sensible) that one should click [ON] to turn the light [OFF]?
How do you do it? Any thoughts or ideas appreciated.
I would use a label and an button to show the action.
Light is On - Switch Off?
Clicking that would change both the label and the button to:
Light is Off - Switch On?
This solution clearly states the status and the action available.
I would definitely include the notion of a checkbox-like control if clarity is your concern. This is a widely accepted interface component, that most people understand.
In any case you can make the entire line clickable, so that it toggles when I click the text as well (just like an HTML Label element).
Showing a button with just the text 'ON' might confuse users whether it toggles the light on, or if the current state is 'on'.
An image speaks a thousand words...
Depending on the type of application, displaying a light switch image that you can click
to set the state of the field might be more intuitive?
You could then have a lightbulb-on and lightbulb-off image to show state.
Not everyone knows what a checkbox is ;)
You could use radio boxes, which are fairly standard controls and should not be confusing to most people.
<input type="radio">Light on<br>
<input type="radio">Light off
Another option is to try and implement some sort of switch button, something like this one that is used on the iPhone:
Switch button in iPhone - off http://www.poolworksbvi.com/POOL_CONTROL/Pool1_files/iphone_switch.png
Switch button on iPhone - on http://www.poolworksbvi.com/POOL_CONTROL/Pool1_files/iphone_switch+on%20copy.png