如果检查行，则循环遍历表并将特定单元格存储在数组中

I currently have a table that is triggered by a drop down. Inside the table, there's a checkbox. When the check box is checked and the user clicks on the confirm button, the code should loop through the table and get the email values of all the checked rows and store them in an array. So far, it can check if the rows are checked. I've found a few ways online but its not working. Here's the table:

我目前有一个由下拉菜单触发的表。在桌子里面，有一个复选框。选中复选框并且用户单击确认按钮时，代码应遍历表并获取所有已检查行的电子邮件值并将其存储在数组中。到目前为止，它可以检查是否检查了行。我在网上找到了一些方法，但它没有用。这是表格：

    <?php if ($picked != null){ ;
      foreach ($picked as $rows): ?> 
        echo base_url(); ?>employer/view/send/<?php echo $rows['username']; ?>-->
      <!--form action="" method="POST"--> 
      <?php endforeach; ?>
      <table id="view_add" 
        class="table dataTable table-striped table-dynamic table-hover _tm">
        <thead>
          <tr>
            <th class="sorting_asc" tabindex="0" rowspan="1" colspan="1"
              style="width: 250px;">
              Applicant Name
            </th>
            <th class="sorting" tabindex="0" rowspan="1" colspan="1"
              style="width: 200px;">
              Employer
            </th>
            <th class="sorting" tabindex="0" rowspan="1" colspan="1"
              style="width: 200px;">
              Post Header
            </th>
            <th class="sorting_asc" tabindex="0" rowspan="1" colspan="1"
              style="width: 450px;">
              Description
            </th>
            <th class="sorting_asc" tabindex="0" rowspan="1" colspan="1"
              style="width: 100px;">
              VIEW CV
            </th>
            <th class="sorting_asc" tabindex="0" rowspan="1" colspan="1" 
              style="width: 100px;">
            </th>
          </tr>
        </thead>
        <tbody>
          <?php foreach ($picked as $rows): ?> 
          <tr>
            <td><?php echo $rows['applicantName']; ?></td>
            <td><?php echo $rows['employerName']; ?></td>
            <td><?php echo $rows['postingName']; ?></td>
            <td><?php echo $rows['postDescription']; ?></td>
            <td style="display: none;"><?php echo $rows['email']; ?></td>
            <td><a id="stress" data-toggle="modal" href="#editButton" 
              data-full="<?php echo $rows['fullName']; ?>" 
              data-school="<?php echo $rows['institution']; ?>" 
              data-state="<?php echo $rows['state']; ?>" 
              data-location="<?php echo $rows['location']; ?>" 
              data-dob="<?php echo $rows['dob']; ?>" data-skill="<?php echo $rows['skills']; ?>" 
              data-sex="<?php echo $rows['sex']; ?>" data-gpa="<?php echo $rows['cgpa']; ?>" 
              data-call="<?php echo $rows['phone']; ?>" 
              data-like="<?php echo $rows['favoured']; ?>" 
              data-award="<?php echo $rows['awards']; ?>" 
              data-interest="<?php echo $rows['interests']; ?>" class="myeditButton"
            >view</a></td>
            <td>
              <label class="switch m-r-40">
                <input type="checkbox" class="switch-input" 
                  id="<?php echo $rows['applicationKey']?>" 
                  data-mail="<?php echo $rows['email']; ?>" 
                  data-confirm="<?php echo $rows['applicationId']; ?>" 
                  id="check" name="check" <?php echo $rows['status'] ? 'checked':''; ?> >
                <span class="switch-label" data-on="yes" data-off="no"></span>
                <span class="switch-handle"></span>
              </label>
            </td>
          </tr>
          <?php endforeach; ?>
        </tbody>
      </table>
      <div class="form-group">
        <input type="submit" value="Confirm" id="mail" class="btn btn-primary mail">
      </div>
    <!--/form-->
 <?php }else{ ;?>
   <div class="alert alert-warning">
     <h4>There are no current Applicants for this post.</h4>
   </div>'
   <?php } ;?>

Here's the little script I've used:

这是我用过的小脚本：

    <script>
$(document).on("click", "#mail", function () //<-small mistake here
{
   var mail_list = [];
   $( 'input[type=checkbox]:checked' ).each(
        function(){
            var mail = $(this).data("mail");

            mail_list.push(mail);

            var emailers = mail_list.join(",");

//SEND TO PHP
           $.ajax({
           type: 'post',
           url: '<?php echo base_url(); ?>employer/view/send',
           data: {
                     chosen: emailers
                    },
           success: function( data ) {
                     console.log( data );
                    }
           }); 
            //the END
        }
    )
});
</script>

My JS isn't so good.

我的JS不太好。

Lastly, heres the php end

最后，继承人的PHP结束

else if ($param1 == 'send') 
        {

        $src1= $_POST['chosen'];
        $array = explode(",", $src1);

        print_r($array);

3 个解决方案

#1

First, you should add a way to "find" the email value of a row. So edit the html with something like that :

首先，您应该添加一种“查找”行的电子邮件值的方法。所以用这样的东西编辑html：

<td style="display: none;" class="email-value">
    <?php echo $rows['email']; ?>
</td>

Now, I think there is a small error in your code, an html id is targetable by # and a class by a .. So with my changement I propose :

现在，我认为你的代码中存在一个小错误，一个html id可以通过＃来定位，而一个类可以通过一个类...所以我建议改变：

$(document).on("click", "#mail", function () //<-small mistake here
{
   var mail_list = [];
   $( 'input[type=checkbox]:checked' ).each(
        function(){
            var mail = $(this).parents("tr").find(".email-value").text();
            //this line search the "tr" parent of each input checkbox that's checked, 
            //and then finds the child "email" value of it.
            mail_list.push(mail);
        }
    )
})

Alter solution

改变解决方案

Add the email in data parameters of the checkbox

在复选框的数据参数中添加电子邮件

<input type="checkbox" class="switch-input" 
              id="<?php echo $rows['applicationKey']?>" 
              data-mail="<?php echo $rows['email']; ?>" 
              data-confirm="<?php echo $rows['applicationId']; ?>" 
              data-email="<?= $rows['email']"
              id="check" name="check" <?php echo $rows['status'] ? 'checked':''; ?> >

Then, the javascript become quite simple :

然后，javascript变得非常简单：

$(document).on("click", "#mail", function () //<-small mistake here
{
   var mail_list = [];
   $( 'input[type=checkbox]:checked' ).each(
        function(){
            var mail = $(this).data("email");

            mail_list.push(mail);
            //the END
        }
    )
})

update : oops, it's parents*, parent can't go upper than one level...

更新：oops，它的父母*，父母不能超过一个级别...

update2 : Add an alternative version, simplified

update2：添加替代版本，简化

#2

<script type="text/javascript">
$(document).on("click", ".mail", function ()
{
    var emailList = [];
    var selectedRows = $( 'table._tm' ).find( 'tbody' ) // select table body and
        .find( 'tr' ) // select all rows that has
        .has( 'input[type=checkbox]:checked' ) // checked checkbox element

          selectedRows.each(function(idx, elem) {
              var email = jQuery(elem).find('input[type="checkbox"]').data("mail");
               emailList.push(email);
          });
          console.log( 'elem:', emailList );
} );

#3

This should be quite easy try something like this:

这应该很容易尝试这样的事情：

var emailList = [];

selectedRows.forEach(function(idx, elem) {
    var email = jQuery(elem).data("mail");
    emailList.push(email);
});

#1