I'm wondering how I can use JavaScript to accomplish the following:
I have an input area with five dropdownlists, and each one has a corresponding radio button. When a dropdownlist is clicked to make a selection, I would like the radio button paired with it to become checked right then. Any help would be appreciated.
Its kind of simple really. Here is a small code for you.
ID the 5 listboxes as "sel1", "sel2" ,...
ID the 5 radio buttons "rad1", rad2,.. Make sure the radio buttons have same name though!
Next, put this function in as a javascrip:
function makeSelection(radioid){
document.getElementById(radioid).checked=true;
}
In the select boxes, attach onchanged listeners:
ie;
<select ... onchange="makeSelection('rad1');" >.. for the 1st select box,
<select ... onchange="makeSelection('rad2');" >.. for the 2ns select box, etc.
Related
Scenario: I have 5 select boxes that hold the 5 weekdays and Instead of having the user click and choose a value for each one I want them to have the option of choosing the first box and have a button next to it that when clicked it auto fills the rest of the select boxes with the same value.
Is it as simple as setting the value of the select boxes equal the the value from the first box? Not sure how to tackle this. Would I also have different IDs and same names for the 5 select boxes or keep them different and apply the value to each option?
Give all the select boxes a class, eg <select class="syncday"> and then have your button's clickhandler do something like
$$("select.syncday").set("value", $$("select.selectday")[0].get("value"))
this takes the 'value' from the first select and applies it to all of them (using mootools' $$)
I'm using a Twitter Bootstrap 3 form with (4) Radio form controls. When a user clicks on any of the four radio controls, an <input type="text"> appears. How do I make it, so that the first input, on any radio option select is "autofocus".
To see code, if you may, please visit: https://von.host/cart.php?a=add&pid=20
It just seems silly to have the user click a radio button, than click again on the input field and type, than click once more on submit button...instead of three clicks, I wish to make it two.
p.s. - i added "autofocus" to all (4) input fields, but it only worked for the first one...of course ^ _ ^
I think, you can this only with a little part of javascript :) for example:
$('input[type="radio"]').focus(function(){
$(this).parent().find('input[type="text"]').focus();
});
In nutshell, this code pass the focus for the input field, when the radio give it.
Keep the autofocus attribute in the first one and use this jQuery code:
$('.domainoptions .option input:radio[name="domainoption"]').change(
function(){
$(this).parent().next().find('input[type="text"]').first().focus();
}
);
in this scenario,
there are 4 radio button as 1,2,3,4,and we have select tag with option tag.
so requirement is onchange of radio button, number of option value of select tag should be displayed.
ex:if radio 1 is click, then select tag may have 10 values then first five values should be displayed.
if radio 2 is click,then select tag may have two values then all values should be displayed.
I think pic can explain more.
Please suggest, how to proceed
look at example
Figure 11–4 Example Select One Components
http://docs.oracle.com/cd/E19159-01/819-3669/bnase/index.html
our scenario,is between Genere and Language.
wen I click "Fiction" then, drop down should display only fiction related values and vice versa.fiction related values are list of array.
I have a panel named pBody and I can clear its controls by using these codes.
clear all textboxes, uncheck radio buttons and checkboxes:
$('#pBody input').val('');
clear only textboxes:
$("#pBody").find("input[type=text]").val('');
or
$("#pBody").find("input:text").val('');
But after clicking clear button I want make some radio buttons checked, for example first radio buttons in the group.
Thanks in advance.
You can use input[type=radio]:first selector to select first radio-button in the list.
Or if you want that every gruop first radio button get selected you can use
$('element').each(function(){
$('input[type=radio]:first', this).attr('checked', true);
});
For check the first radio button as default you can use the below code
$('#pBody').find('input:radio').first().prop({checked:true});
or
$('#pBody').find('input:radio').first().attr({checked:true});
and for checkboxes use
$('#pBody').find('input:checkbox').first().prop({checked:true});
or
$('#pBody').find('input:checkbox').first().attr({checked:true});
I'm posting the link where I am having the problem. I'm having issues with the radio buttons.
I have three images and I'm suppose to be able to click on a radio button and the image changes. That part works great. But when I go for another button, the last one I clicked on stays checked. How do I make it uncheck? I only want what is selected to be checked. ty!!!!!
http://www-desi.iro.umontreal.ca/~valiquki/tp3Kim/TP3KimValiquette.html
The radio buttons have to have the same "name" attribute to be a part of the same group.
Make sure that all of the radio buttons are in the same group. See this for how to do so.
Basically, use the name attribute to assign a group name. That way they will be part of a group and the browser will handle selection/deselection. Name is not the name of the radio button, but the name of the group.
You could use 'side-dishes' if you like for all of them.