Javascript to select checkbox - javascript

What would be the javascript below to select the checkbox for value 0?
<input name="bootproto" id="bootproto" type="radio" value="0" key="bootproto">
I tried using
$('input[name="bootproto"]').click() but it didnt seem to work.

$("#bootproto").prop("checked",true);
Since you're using jquery, just set the property "checked" to true (I don't see why you're name selecting when you have a perfectly good ID there as well)
If you want to check it ONLY if value=0, add an if statement before this.

document.getElementById('bootproto').checked = true;
OR
$('#bootproto').prop('checked',true);

I figured out that $('input[value="0"]').click() seemed to work for me.

Try this,
$('input[name="bootproto"]').attr('checked',true);
Checked is actually an attribute of the input tag of type radio, So that you can use the .attr() function to set its checked attribute as true.
DEMO

You don't mention that you're using jQuery even tho you've apparently tried the syntax. On the off-chance you're not using it, try:
var i = document.querySelector('input[value="0"]').checked = true;

I would do the following : $('input[name="bootproto"]:not(:checked)').

Related

Why can't I change my disabled checkbox to enable?

Simple question, so I made sure to try and a lot of solutions before posting this. I have a checkbox and I can't seem to enable it.
With vanilla JS, I've tried removing the attribute, as well as setting the disabled flag to false, and also using jQuery i've tried to use the Prop to no success.
'''html
<input type="checkbox" id="chkAllowToAdminService" name="chkAllowToAdminService" disabled="disabled" data-init-plugin="switchery">
'''
I've tried the following and none of them are working (vanilla JS and jQuery)
'''
document.getElementById('chkAllowToAdminService').disabled = false;
document.getElementById('chkAllowToAdminService').removeAttribute('disabled);
$('#chkAllowToAdminService').prop("disabled", false);
'''
No error messages at all, just nothing seems to be happening.
To remove attribute you may use removeAttribute(name). In your case:
const checkbox = document.querySelector('#chkAllowToAdminService')
checkbox.removeAttribute('disabled')
To set attribute setAttribute(name, value).
// In jQuery
$('#chkAllowToAdminService').attr('disabled','disabled'); // Add disabled
$('#chkAllowToAdminService').removeAttr('disabled',''); // Remove disabled
// OR
$("#chkAllowToAdminService").attr("disabled",true);
$("#chkAllowToAdminService").attr("disabled",false);
// In JavaScript
document.getElementById("chkAllowToAdminService").disabled = true;
document.getElementById("chkAllowToAdminService").disabled = false;
I think you might have two issue :
make sure you have unique id of element 'chkAllowToAdminService' no other element have same id.
in your remove attribute syntex : document.getElementById('chkAllowToAdminService').removeAttribute('disabled);
I can see quote ' is missing at last.

Why i always fail to make check mark to checkbox via javascript?

Look to my code below :
HTML :
<input type="checkbox" name="xyz[1][]" id="sel_44" style="margin:2px;" value="12345" onclick="myClick(this)">
Javascript :
<script>
$('#sel_44').attr("checked", true);
</script>
I already try every method (method that suggest by acceptance answer) in this URL : Check/Uncheck checkbox with javascript?
My Problem and Question :
I can sure $('#sel_loc_cb_44') is not null
and not undefined. But i can make checkmark via javascript or jquery.
How to fix my code and what's the source of problem?
Please kindly add jsfiddle to your solution post. thank you
try using
$('#sel_44').prop("checked", true);
you must change the propery of the DOM object instead of attribute
try this with jquery:
$("#sel_44").prop('checked',true);
Since jquery 1.6+ prop method provides a way to explicitly retrieve property values, while attr retrieves attributes. Here checked is a property. So use prop for checking a checkbox.
$('#sel_44').prop("checked", true);
Try this
$(document).ready(function() {
$('#sel_44').attr("checked", true);
});
I have tried in the jsfiddler, looks like you need to put your code inside the document ready function.
https://jsfiddle.net/o2gxgz9r/5935/
$(function(){
$('#sel_44').prop('checked',true);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox" name="xyz[1][]" id="sel_44" style="margin:2px;" value="12345">

Change attribute

I've got a selection/dropdown with ID #pa_buy-sell[]. What I want to do is if the value is "buy" I want to change the attribute data-required="yes" to data-required="no" from a input field with class wpuf__regular_price_657. I also want to hide the span with class required. The code has to work in WordPress.
I'm quite new in this, so I'm not sure what's the right code. But I thought something like this could be a good starting point:
$('#pa_buy-sell[]').change(function(){
if($(this).val() == 'buy'){
//something need to happen here
}
});
Can someone help me with this?
Your code is correct until now. You have to replace the comment with the following lines:
$('.wpuf__regular_price_657').data('required','no');
$('span.required').hide();
To change the attribute to yes or no. you can use this:
$(".wpuf__regular_price_657").attr("data-required","no");
or you can use disabled as true or false, if you dont want to take input as
$(".wpuf__regular_price_657").attr("disabled", true);
and for hiding the particular span:
$("span.required").hide();
This will work fine in wordpress too
Hope it helped you
Please check with "===" which confirms Strong type checking (type and value) comparison and also refer the code for hiding the div with class required.
<script>
var $ = jQuery.noConflict();
$('.pa_buy-sell.wpuf_pa_buy-sell_657').change(function(){
if($(this).val() === "buy"){
$(".wpuf__regular_price_657").attr("data-required","no");
$("span.required").hide();
}
});
</script>

Get value of a check box in JavaScript?

I am a newbie to jquery.
I have this code written. I want to get the value of 'newValue' when the checkbox is checked. But this code returns 'undefined'.
Please can someone help to get the state of the checkbox: the return value should be true or false, 1 or 0.
$(tableCell).empty();
/Checkbox
$('<input type="checkbox" checked class="EditContactRow" style="width: 20%" />').appendTo($(tableCell)).val(controlValue).blur(function () {
var newValue = $(tableCell).find('checkbox').val();
.....
.....
}
Thanks
Ahoy, Olumide Omolayo
your code seems a little bit messy but it can be fixed for sure. Where is your HTML, would you please add it to your question?
If you need an example: if you have a checkbox you would take it's value by selecting it like this
var myCheckboxValue = $('#myCheckbox').val();
your code:
$('<input type="checkbox" checked class="EditContactRow" style="width: 20%" />')
will not work. since $() is used to access jQuery selectors, those SELECT an element in the HTML/DOM, then you do something with the element. (see this video)
If you want to ADD an element to the HTML/DOM you'd probably use something like
$("#myDiv").html('my html that will be added to the element with id="myDiv"');
Hope this helps. Feel free to ask more :)
P.S. If you post your full code here, we might able to help you much more than just write at random here. People might be able to actually give you the fixed version :)
just a small syntax error.
Change this line var newValue = $(tableCell).find('checkbox').val();
to
var newValue = $(tableCell).find('input[type="checkbox"]').val();
The problem was .find('checkbox') you are trying to find a element who's name is checkbox and you dont have one.. the attempt should be to find a element 's whos type is "checkbox" so use the syntax .find('input[type="checkbox"]')
Correct answer to my question from Reddy
var newValue = $(tableCell).find('input[type="checkbox"]').val();
Thank you all

How come CheckObject.checked won't work?

I have a checkbox that by default is set to checked:
<input type="checkbox" id="chkobj" checked />
And I use the following javascript to uncheck it depending on the value of a variable:
var chk = document.getElementById("chkobj");
if(myStr=="1")
{
chk.checked=true;
}
else
{
chk.checked=false;
}
Yet, no matter what I try, the value won't change. Any idea why? I rather stick to pure JS than use jQuery. I'm really curious as to why this won't just work in plain JS. Any help is greatly appreciated. Thanks in advance :)
If you check the element itself. Even if you set chk.checked = false. Which makes chk.checked==false to be true. The element would still have checked attribute and would probably display as a checked box... try chk.removeAttribute('checked') as well to remove the check. And chk.setAttribute('checked', 'checked') to check the box visually.

Categories

Resources