CODEWITHSUNDEEP
jquery
rubo77
rubo77

Reputation: 20817

Change the value of a variable outside of a jquery function

I have this code where I want to iterate over some input fields with a certain data attribute:

<input type="checkbox" name="asdf4faef4are" checked data-something="1" onchange="check()">
<input type="checkbox" name="fgrea4g3agere" checked data-something="2" onchange="check()">

and 

function check(){
  var dont
  $('input[data-something]').each(function(){
    if($(this).attr('checked')=="true"){
        dont=true
    }
  });
  alert(dont)
}

but the variable dont is not filled because it is not set inside the function.

How do I transfer a variable to the outer global scope?

I want to check if all input fields are unchecked by the user.

Update: I found out! my example worked already just fine if I change attr('checked')=="true" to attr('checked')==true without quotes. But your Answer is a more elegant solution anyway. thanks ;)

Upvotes: 0

Views: 49

Answers (3)

Rohit Sharma
Rohit Sharma

Reputation: 3334

It may help you in your way..!

$('[type=checkbox]').prop('checked', true)
function check(){
  var dont
    if($(this).prop('checked') == true){
    	$(this).prop('checked', false)
        dont = true;
    } else {
    	$(this).prop('checked', true)
    	dont = false;
    }
  alert(dont)
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox" name="asdf4faef4are" data-something="1" onchange="check()">
<input type="checkbox" name="fgrea4g3agere" data-something="2" onchange="check()">

Upvotes: 0

Milan Chheda
Milan Chheda

Reputation: 8249

Here is the working code. You first need to initialise the variable and secondly, call it when the checkboxes are clicked/changed.

Just saw below statement and made changes to code accordingly.

I want to check if all input fields are unchecked by the user.

function checkAndAlert() {
  if ($('.someclass:checked').length == $('.someclass').length) {
    console.log("All are checked.");
  } else if ($('.someclass:checked').length == 0) {
    console.log("None are checked.");
  }
}

$(".someclass").on('change', function() {
  checkAndAlert();
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox" class="someclass" name="asdf4faef4are" data-something="1">
<input type="checkbox" class="someclass" name="fgrea4g3agere" data-something="2">

Upvotes: 1

Rory McCrossan
Rory McCrossan

Reputation: 337560

I want to check if all input fields are unchecked by the user.

In this case you can avoid the loop by using the :checked selector, and verifying that the length property is 0. Try this:

$('input[data-something]').change(function() {
  var noneChecked = $('input[data-something]:checked').length == 0;
  
  if (noneChecked)
    console.log('No items checked');
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox" name="asdf4faef4are" checked="true" data-something="1" />
<input type="checkbox" name="fgrea4g3agere" checked="true" data-something="2" />

Upvotes: 1

Related Questions