循环遍历html表并检查是否选中了复选框

Question

What I'm trying to do here is validating HTML table. I need at least one checkbox to be checked before proceeding. It's doing what it's need to do, except when I don't check a checkbox.

It loops the alert "nothing found" by the count of data on the HTML table. How can I make it better? I need to loop inside the table to get the data on the same row with the checkbox checked.

JS

$('#dataTable').find('tr').each(function () {
    var row = $(this);
    if (row.find('input[type="checkbox"]').is(':checked') ) {
        alert "found"
        //im getting data here.
        });
    }else{
        alert "NOthing found"
    };
});

Answer 1

No need to loop through anything. Just look for a checked checkbox inside dataTable with your selector. If it exists, then your "true" condition is met.

if ($('#dataTable input[type="checkbox"]:checked').size()) {
    // Proceed
}

Now, if you want to do something with the data inside the "checked" rows, you could do something like this:

var checkedItems = $('#dataTable input[type="checkbox"]:checked').each(function() {
    // Do something with the row
    console.log($(this).parent('tr').find('.data-selector').val());
});
if (!checkedItems.size()) {
    // Nothing was checked
}

Answer 2

Likeso you will execute your code for every checked row, and if no row is checked, you will get to execute what you decide is apropriate, without much resources going to waste

  var is_table_empty = true;
 jQuery('#dataTable').find('input[type="checkbox"]:checked').each(function(){
    var row = jQuery(this).closest("tr");
    //do what needs to be done to an active row
    is_table_empty= false;
  });
  if(is_table_empty)
  {
     //do what you need to do if nothing is clicked
  }

Answer 3

try this same as your code.

var checkFound = false;

$('#dataTable').find('tr').each(function() {
  var row = ;
  if (!checkFound && $(this).find('input[type="checkbox"]').is(':checked')) {
    checkFound = true;
    return false;
  }
});

if (checkFound)
  alert('checked Found');
else
  alert('nothig checked');

Answer 4

In stead of alerting throughout the loop, why not use a flag and update it when something is found. Based on the flag, (at the end - after the loop) just display the status!. I hope the following will modification will help you:

var found = false;
$('#dataTable').find('tr').each(function () {   
var row = $(this);
if (row.find('input[type="checkbox"]').is(':checked') ) {
    found=true;
    //alert ("found"); 
    // Do your job here
    }
else{
     //alert "NOthing found"
     //found=false;
    };
});
if (!found){
    alert("Nothing Found");
}
else{
     alert("Found");// Or you can omit the else part
}