I have a page with 10-25 checkboxes, for a User to choose from.
The checkbox Name and Value are unique to every User/choice and is handled appropriately in the backend.
So, without relying on those two properties, is it possible to create a simple "Uncheck all" button that will uncheck all the checked checkboxes?
I guess it's OK to use the ID attribute, I can add one to the template.
The page is built with HTML and JQuery 2.0.3
Here is a sample checkbox:
<input type="checkbox" name="10953734" value="82S1X93">
here is a small jQuery to solve your issue.
$("input[name='10953734']").prop("checked", false);
or if you want all check box inside a container to be unchecked
$("#containerID input[type='checkbox']").prop("checked", false);
Add a class to them:
$("input.myClass").prop("checked", false);
Related
I have values from one form that need to be transferred to another.
var manager = $('input[type=checkbox]:checked').val();
I'm capturing the value with this. and trying to send it to this.
$('input[type=checkbox]:checked').val(manager);
but I don't know what to put into the next set of jquery to transfer it over.
.val() works for strings/numbers but not checkboxes or radio buttons which I am trying to do.
Please advice.
Try jQuery prop() function to transfer the state of one checkbox to another.
Also use correct selectors. $('input[type=checkbox]:checked') will only select CHECKED checkboxes.
see this fiddle for an example: https://jsfiddle.net/iPirat/p5f07br4/
in this fiddle, the checkbox in the first form is selected similarly to what you did.
the checkbox insecond form is selected using an ID.
I have a MVC Web-Page containing 1 datepicker. After selecting the date, there is an AJAX call to the server providing the user a list of possible actions (being radio buttons)
The user can select a radio button but this cannot be deselected if the user wants.
I tried to fix this with some javascript code, but I cant seem the access those radio buttons when generated dynamically in a partial result by the AJAX call.
It is very important, the big problem is that the radio buttons are not present on the original form. and I think therefore I cannot access them.
$('#nameofradiobutton')
$('input[name='nameofradiobutton'])
$('input[type=radio])
$('input')
All these and many more are not working not even the last one addressing all input controls...
Any guidelines? starting points? tips? tricks?
Thanks!
Except for if the DOM element you are trying to access is in an iframe there shouldn't be any reason you can't access it. The only reason I can think of why you can't access it then is because you try to access it before it is added to the page so for example you have your ajax callback call a function dowork and it looks like this:
function dowork(){
//add the radio buttons
$('.myradiocontainer').append($('<input type="radio" id="value1" />'));
//you try to check it here but it doesn't work
$('#value1').prop("checked", true);
}
If this is the case then you can do this instead:
function dowork(){
//add the radio buttons
$radio1= $('<input type="radio" id="value1" />');
$('.myradiocontainer').append($radio1);
//you try to check it here and it works
$radio1.prop("checked", true);
}
$("#parent_element").on("click", "input[name=radio_button]", function(){
var radio_button = $(this);
});
Where parent_element is the parent of your radio button and is not dynamic (present when the dom is loaded). radio_button is the name of radio button. Variable radio_button holds the actual radio button element.
I have a bootstrap modal with a form inside, This means I require to programmatically set check boxes. When I attempt to programmatically select, deselect then reselect the checkbox the reselection doesn't get made.
Whenever I call .attr('checked', false); the following .attr('checked', true) doesn't seem to make changes.
How can I check the checkbox after it been unchecked?
HTML
<input value="None" name="hazards[]" id="hazard1" type="checkbox">
jQuery
$('#hazard1').attr('checked', true); //automated input check
$('#hazard1').attr('checked', false); //User cancels form and unchecks input
$('#hazard1').attr('checked', true); //Reopens form, but doesnt get checked
Thanks to Stryner for poinitng out this quick solution for something I have overlooked.
The solution is to simply replace the .attr() with .prop(). This is an updated syntax that replaces the .attr. Unlike the 'attribute' providing just a string, the 'property' provides more infomation on its property type allowing the use of bools (which are needed for checkboxes).
.prop() vs .attr()
I use this very nice plugin in my project called jQuery Dropdown Check List (https://code.google.com/p/dropdown-check-list/) specifically one of example which is named: 'Single select with radio buttons instead of checkboxes'.
One big problem with this example is that I am not able to (I was trying to do this by jQuery) set radio button unchecked. I was using for example:
$("input:radio").attr("checked", false);
Or
$("input:radio").removeAttr("checked");
And unfortunately nothing. Can anyone give some advice how fix this thing?
Try this:
- For check:
$("input:checkbox").attr("checked", "checked");
or
$("input:checkbox").prop('checked', true);
-For uncheck:
$("input:checkbox").removeAttr("checked");
or
$("input:checkbox").prop('checked', false);
I tried both methods in the demo page(http://dropdown-check-list.googlecode.com/svn/trunk/doc/dropdownchecklist.html) for the "Single select with radio buttons instead of checkboxes", and turns out to be fine: the selected radio button has removed. However, the value stays in the span because remove selected radio cannot remove selected value.
My suggestion is that after you uncheck the radio, also set a html space to the span, it removes the selected value and also keep the height of its container.
This plugin uses checkbox not radio inputs so you must use $('input:checkbox') or $('input[type="checkbox"]') as your selector!
Click here to see a demo!
How to check/uncheck a checkbox with javascript in lotus notes?
I´ve tried a lot of different javascript codes but none worked....
the input type checkbox is insidea form called form1..
thanks
View the source for the Web page produced by Domino and determine what the name of your checkbox is. You're looking for an HTML tag called with a type="checkbox". Get the id of that checkbox and use that id to replace the "" part of the code below.
document.form1.<YOUR CHECKBOX ID HERE>.checked = true;
For example, if the checkbox is named "mycheckbox", the code would be:
document.form1.mycheckbox.checked = true;
If you need to toggle the checkbox between checked and unchecked, you can use this code, which just sets the checkbox to the opposite state.
document.form1.mycheckbox.checked = !document.form1.mycheckbox.checked;