How can I find if a specific checkbox is checked?

Question

I've looked at lots of posts but I couldn't find anything that works in my case. I need to display of a preview of the user's signature in their profile, with the options to not show their phone number and/or email address so I have a checkbox for each.

Here's my HTML for the checkboxes:

<div class="checkbox">
    <label>
      <input type="checkbox" name="showInSignature[]" id="showPhoneId" value="showPhone" class="checkbox style-0" checked="checked">
      <span>Tel&eacute;fono</span>
    </label>
</div>

<div class="checkbox">
    <label>
      <input type="checkbox" name="showInSignature[]" id="showEmailId" value="showEmail" class="checkbox style-0" checked="checked">
      <span>Direcci&oacute;n de e-mail</span>
    </label>
</div>

and here is the jQuery:

var fname = $('#personalOptionsForm').find('[name="fname"]').val(),
    lname = $('#personalOptionsForm').find('[name="lname"]').val(),
    cellphone = $('#personalOptionsForm').find('[name="cellphone"]').val(),
    email = $('#personalOptionsForm').find('[name="email"]').val(),
    if ($('#showPhoneId').is(':checked') = true) {
        showPhone = 1;
    } else {
        showPhone = 0;
    },
    // showPhone = (($('input[name="showInSignature[]"]')['showPhone'].checked = true) ? 1 : 0),
    // showEmail = (($('input[name="showInSignature[]"]')['showEmail'].checked = true) ? 1 : 0),
    str = "<strong>" + fname + " " + lname + "</strong><br /><br />" + ((showPhone = 1) ? 'Tel&eacute;fono: ' + cellphone + '<br />' : '') + "E-mail: <a href=\"mailto:" + email + "\">" + email + "</a>",
    html = $.parseHTML( str );

$('#signaturePreview').append(html);

If I comment out the IF (as I've commented out other tries I've made) and the ternary operator in the str var it works but NOTHING is displayed when trying to use a dynamic value (like the phone checkbox). There's only two methods there but I've tried many more. None of them work. Nothing is appended.

How can I do it? Thanks in advance!

Simon · Accepted Answer · 2017-05-12 19:55:31Z

2

showPhone = $('#showPhoneId').is(':checked');

surely that's all you need. It returns a boolean

answered May 12, 2017 at 19:55

Simon

7844 silver badges8 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

CesarA Over a year ago

Perfection! Thanks!

Woodrow · Accepted Answer · 2017-05-12 20:01:43Z

1

$(document).ready(function() {
  alert('Is Checked: ' + $('#showPhoneId')[0].checked);
  console.log(typeof $('#showPhoneId')[0].checked);
  console.log($('#showPhoneId')[0].checked === true);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="checkbox">
  <label>
      <input type="checkbox" name="showInSignature[]" id="showPhoneId" value="showPhone" class="checkbox style-0" checked="checked">
      <span>Tel&eacute;fono</span>
    </label>
</div>

answered May 12, 2017 at 20:01

Woodrow

2,8221 gold badge17 silver badges20 bronze badges

Comments

Sanchit Goel · Accepted Answer · 2017-05-12 20:15:38Z

In your code you are using assignment operator "=" which means

a = b (value of b is assigned to a),

in your case you are trying to assign true to $('#showPhoneId').is(':checked')

kindly"==" instead

 var fname = $('#personalOptionsForm').find('[name="fname"]').val() ,
    lname = $('#personalOptionsForm').find('[name="lname"]').val() ,
    cellphone = $('#personalOptionsForm').find('[name="cellphone"]').val(),
    email = $('#personalOptionsForm').find('[name="email"]').val(),

     //dummy values
     fname = 'abc', lname="dksjdn",
     cellphone = "98989898", email = "[email protected]";
    if($('#showPhoneId').is(':checked') == true) {
        showPhone = 1;
    } else {
      showPhone = 0;
    };

    // showPhone = (($('input[name="showInSignature[]"]').is(':checked') == true) ? 1 : 0),
    // showEmail = (($('input[name="showInSignature[]"]').is(':checked') == true) ? 1 : 0),
    str = "<strong>" + fname + " " + lname + "</strong><br /><br />" + ((showPhone == 1) ? 'Tel&eacute;fono: ' + cellphone + '<br />' : '') + "E-mail: <a href=\"mailto:" + email + "\">" + email + "</a>",
    html = $.parseHTML( str );

$('#signaturePreview').append(html);

please refer https://jsbin.com/rolodozode/1/edit?html,js,output

Collectives™ on Stack Overflow

How can I find if a specific checkbox is checked?

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related