Watch some penguins on the livecam!
Course Of The Month
5 days, 6 hours left to enrollBecome a Premium Member and unlock a new, free course in leading technologies each month.
Solved
Cant select checkbox dynamically
Posted on 2016-10-03
Hi,
I have an ajax call that returns a number of values.
With it I am assigning a value to an input text field (this works fine)
and trying to show a checkbox as 'checked'
I've tried a number of methods to try and check the checkbox dynamically but it simply isn't.
Is there something I'm missing?
using Jquery 1.9+
bootstrap 3
html segment
Script segment
I have an ajax call that returns a number of values.
With it I am assigning a value to an input text field (this works fine)
and trying to show a checkbox as 'checked'
I've tried a number of methods to try and check the checkbox dynamically but it simply isn't.
Is there something I'm missing?
using Jquery 1.9+
bootstrap 3
html segment
<div class="form-group form-group-xs">
<div class="col-md-4">
<div class="checkbox">
<label><input type="checkbox" value="1" class="styled" id="horsepower_check" name="specs[checks][horsepower]">Horsepower</label>
</div>
</div>
<div class="col-md-8">
<div class="col-md-12">
<input type="text" class="form-control input-xs" value="" id="horsepower" name="specs[values][horsepower]">
</div>
</div>
</div>
Script segment
$('#horsepower').val(data['engine']['horsepower']['!value']);
$('#horsepower_check').prop("checked", true);
[X]
Welcome to Experts Exchange
Add your voice to the tech community where 5M+ people just like you are talking about what matters.
- Help others & share knowledge
- Earn cash & points
- Learn & ask questions
3 Comments
I see nothing wrong with the line that checks the checkbox. However,
Try reversing the order of the two lines you've posted and see if the checkbox gets checked. If not, can you please post a link to the live page?
One thing to consider is if there is another element with the id horsepower_check. Ids must be unique and when there are duplicates, only one is targeted. I believe it's the first that gets targeted because the DOM would not accept the second. But it could be the latter.
Also, have you validated your HTML? (Appears to be down at the moment!)
With it I am assigning a value to an input text field (this works fine)I'm surprised this works with the not operator (!) in the JSON object identifier, !value. Javascript identifiers must start with a letter, $, or _ and they can contain letters, digits, _ and $. But they cannot contain any other punctuation, especially one that is reserved.
Try reversing the order of the two lines you've posted and see if the checkbox gets checked. If not, can you please post a link to the live page?
One thing to consider is if there is another element with the id horsepower_check. Ids must be unique and when there are duplicates, only one is targeted. I believe it's the first that gets targeted because the DOM would not accept the second. But it could be the latter.
Also, have you validated your HTML? (Appears to be down at the moment!)
Active today
Kim's correct... commenting out the first jQuery operation causes it to work.
Demo:
http://jsfiddle.net/znvyfa26/2/
Demo:
http://jsfiddle.net/znvyfa26/2/
Featured Post
Question has a verified solution.
If you are experiencing a similar issue, please ask a related question
Introduction
If you're like most people, you have occasionally made a typographical error when you're entering information into an online form. And to your consternation, the browser remembers the error, and offers to autocomplete your future entr…
Today, the web development industry is booming, and many people consider it to be their vocation. The question you may be asking yourself is – how do I become a web developer?
The viewer will learn the basics of jQuery, including how to invoke it on a web page.
Reference your jQuery libraries: (CODE)
Include your new external js/jQuery file: (CODE)
Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles.
Reference your jQuery libraries:
(CODE)
Include your new external js/jQuery file:
(CODE)
Write your first lines of code to setup your site for jQuery…
Suggested Courses
Course of the Month5 days, 6 hours left to enroll
705 members asked questions and received personalized solutions in the past 7 days.
Join the community of 500,000 technology professionals and ask your questions.