jsFiddle here.
I'm a novice at Javascript and having trouble following the documentation at the iCheck page. I've followed the answer to what appears to be a very relevant StackOverflow question here but cannot get an alert to pop up displaying the value I've selected. Can anyone point me in the right direction, please?
HTML
<p>Are you sure you want to have your details removed from our marketing list?</p>
<div id="unsubscribe_radio">
<ul>
<li>
<input type="radio" name="iCheck" value="yes">
<label>Yes</label>
</li>
<li>
<input type="radio" name="iCheck" value="no">
<label>No</label>
</li>
</ul>
</div>
Javascript
$(document).ready(function () {
$('input').iCheck({
radioClass: 'iradio_flat-orange'
});
$("input:radio[name=iCheck]").click(function () {
var value = $(this).val();
alert("You clicked " + value);
});
});
You must use iCheck like this
$(document).ready(function () {
$('input[name="iCheck"]').on('ifClicked', function (event) {
alert("You clicked " + this.value);
});
$('input').iCheck({
radioClass: 'iradio_flat-orange'
});
});
DEMO
Documentation
Just another hacky way to get checked value with jQuery selectors:
$(".checked input[name=name-of-original-input]").val();
But AFAIK default class for checked values could be changed in configuration.
BTW, I think that iCheck isn't a good choice if it creates such issues with very simple functionality.
I found the other answers to be useful. However, they are dependent on iCheck's 'ifClicked'. You may not want the value to pop up every time a new radio button is selected, but instead only when a user hits a specific button calling for the alert and corresponding value.
For example:
$(document).on('click', '.buttonClass', function(event) {
return alert($('.radioClass:checked').val());
});
JS:-
$(document).ready(function () {
$('input').iCheck({
radioClass: 'iradio_flat-orange'
});
$('input').on('ifClicked', function (event) {
var value = $(this).val();
alert("You clicked " + value);
});
});
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With