In my form I have some TextBoxes. Once the value of TextBox is changed then corresponding RadioButton will be selected. But I want to prevent users from changing the value of RadioButton.
I tried disabling like this.
optA.Attributes.Add("disabled", "disabled");
But this script greys out the radiobutton which is not looking good. Is there any script to prevent users from clicking/changing the selected value of radiobutton?
Small example is
totalval=document.getElementById('txt1').value+document.getElementById('txt2').value
if (totalval>101)
document.getElementById('optA1').checked=true;
else if(totalval<100)
document.getElementById('optA2').checked=true;
This is what I want. So the users should not change the value of radiobuttons (optA1,optA2)
if am using
optA1.Attributes.Add("disabled", "disabled");
I couldnt get the value of optA1 at server side.
My aspx code is
<asp:RadioButton ID="optA1" GroupName="optAchieve" runat="server" Text="30" value="30" onclick="indicateColor()" />
<asp:RadioButton ID="optA2" GroupName="optAchieve" runat="server" Text="20" value="20" onclick="indicateColor()" />
Try to prevent user action by onclick event like this :
optA.Attributes.Add("onclick", "return false;");
You have to right javascript on radio button click , no matter what the radio option is selected always select the default option from javascript.
Attach a readonly class and change attribute of radio button to unchecked on each click.
<input type="radio" id="radio1" name="radio" class="readonlyradio">
<input type="radio" id="radio2" name="radio" class="readonlyradio">
Use this function in your JS:
$(".readonlyradio").click(function(){
$(this).attr('checked', false);
});
Check this fiddle:http://jsfiddle.net/Xwtvp/
Hope it helps.
Related
New to the angular js need to know how to check radio button 'B' if Radio button 'A' is checked?
My code
<input type="radio" name ="employeeData.seatChange1" ng-model="employeeData.seatChange" value="yes" > A
<input type="radio" name ="employeeData.seatChange" ng-model="employeeData.seatChange" value="no" > B
<input type="radio" name ="employeeData.seatChange3" ng-model="employeeData.seatChange" value="no1" > C
see https://docs.angularjs.org/api/ng/input/input%5Bradio%5D
you'll want to have multiple radio buttons, each with it's own value to set some property to (although this is weird for a yes no you are better off with a checkbox, but if you had multiple values this is how radio buttons work)
<input type="radio" ng-model="employeeData.seatChange" ng-value="true" />A
<input type="radio" ng-model="employeeData.seatChange" ng-value="true" />B
when you have just one radio button, if it is not checked by default or you have no ng-value it will be undefined, but also having only one radio button, you could never unselect it.
Try this, Hope this Helps.
If you want to check both radio button ,rather than using radio button go for check box ,as I don't know why you are using radio button its better to use check box radio button.
If you want to use Radio button only then in the Don't use name as if name is used both radio button is grouped so one is checked then automatically other also unchecked which is default.So as VikrantMore says you can avoid name.
My advice as per requirement go for check box.
I want to create a checkbox which is unchecked always by default and users should not check it. I don't want to make the checkbox disabled as i want to pass the value of the checkbox when i submit the form. Please suggest.
The below code is not working:
<input type="checkbox" id="chkbox1" name="chkbox1" value="unChecked" checked="false" readonly="readonly">
With the above code checkbox is always selected, i want the checkbox always be unselected and users should not able to select it.I should not use the disable option too as i want to send the value of checkbox when i submit the form.Thanks.
Just remove the checked attribute all together
<input type="checkbox" id="chkbox1" name="chkbox1" value="unChecked" readonly="readonly" />
Setting the checked attribute with any string value (even false) makes the checkbox checked
i want the checkbox always be unselected and users should not able to select it.I should not use the disable option too as i want to send the value of checkbox when i submit the form
It doesn't really sound like you want a checkbox at all, but just a hidden input that sends a value
<input type="hidden" name="chkbox1" value="unChecked" />
checked attribute sets the checkbox to checked status, no matter what value the attribute checked has.
checked="checked"
checked="true"
checked="false"
checked=""
all these set to checked status
so there is no way to unset the checkbox (except some js solution) manuelly except for completely dropping the checked attribute
UPDATE: Simply change disabled to readonly, so that user cannot check it, but you still can submit this field with form
I'm new so I can't leave a comment. But according to my understand to your problem, like#adeneo suggested, why not first use a hidden one that does pass a value for the "do" with the program; then put up a dummy disabled one for the "look" with the users? As you only need it for the moment? Then later you just hide the dummy one and show the real one?
I have two radio button.
and this is my jquery code to unselect the radio button when the other one becomes selected.
$("#RdbToday").click(function () {
$("#RdbDateRange").attr("checked", false);
});
$("#RdbDateRange").click(function () {
$("#RdbToday").attr("checked", false);
});
It is not working. which means that when I select the first one, the other one still on. also I can't unchecked the radio button once I checked it. why?
use .prop() instead:
$('radio_btn_selector').prop('checked', false);
Millind's answer right i am posting this alternative way you can use prop name
of html
Like this
<input type="radio" name="foo">
<input type="radio" name="foo" checked>
<input type="radio" name="foo">
See working demo
Demo
As your comment says you are using asp.net then its very simple to use groupname attribute Read here.....http://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.radiobutton.groupname(v=vs.110).aspx
I have a form with some checkboxes which go like this:
<input type="checkbox" id="id6" value="3" onclick="optionselect('day','3','id6','50')" />
Conditioned on another input I can have these checkboxes checked automatically but for some reason I can't trigger the "optionselect".
I've tried some of the following, but nothing works:
$("#id6").prop("checked", true).trigger("click");
$("#id6").prop("checked", true).triggerHandler("click");
$("#id6").prop("checked", true).click();
FYI, "optionselect" just does a bit of math in some other text inputs.
I think that problem is that you should use onchange event in this case, not click. Try this:
<input type="checkbox" id="id6" value="3" onchange="optionselect('day','3','id6','50')" />
and
$('#id6').prop('checked', true).change();
Basically .click() effectively unchecks checkbox after you checked it with prop('checked', true).
I have this form here and want each radio buttons not to be able to be checked. I dont want disabled because if one happens to be selected I still want that value to be submitted to the database. This is just a basic example.
When I click on one of them it checks, then does not allow me to click the other one.
I want both buttons not to be able to be checked.
<form action="here.php" method="post">
<input onclick="return false" type="radio" name="firstone" value="Yes" /> Yes
<input onclick="return false" type="radio" name="firstone" value="No" /> No
<input type="submit" />
</form>
Does anyone know how to fix this? I dont want to use javascript.
Rather than trying to prevent clicking on radio buttons. You should use a hidden element to contain the values to send with your form.
The only reason I can imagine you want to have them disabled, but not 'disabled' is because they look ugly when they're disabled.
How about you just change the CSS on the page?
:disabled CSS selector