JQuery每个都在表行中获取多个表数据的值

时间:2017-10-13 08:23:42

标签: javascript jquery codeigniter

嗨,我有这个有多行的表。 我想知道如何在此表格的每一行中获取某些数据。在此表格中,我需要获取学生编号数据及其随附的成绩。

<tbody>
   <?php foreach ($class_list_view as $student) { ?>
   <tr>
      <td class="studentnumber"><?= $student->studentnumber ?></td>
      <td><?= $student->lastname ?></td>
      <td><?= $student->firstname ?></td>
      <td><?= $student->middlename ?></td>
      <td><?= $student->level ?></td>
      <td><?= $student->year ?></td>
      <td>
         <select class="custom-select grade" style="height: 20px;">
            <option selected value="">Select Grade</option>
            <option value="passed">Passed</option>
            <option value="failed">Failed</option>
         </select>
      </td>
   </tr>
   <?php } ?>
</tbody>

我试过在jquery中使用each循环,但我不知道如何使用它来获得类似/内联选择器。

 $("table tbody tr td.studentnumber").each(function (index) {
        studentnum_array.push( {"studentnumber": $(this).text(), "grade": $('table tbody tr td select.grade').val() } );
    });

     console.log( studentnum_array );

但是在grade索引中它只需要第一个。它应该采用类似于td studentnumber的每行中select的值。

2 个答案:

答案 0 :(得分:2)

您可以遍历行而不是单元格...

var studentnum_array = [];

$("table tbody tr").each(function(index) {
    studentnum_array.push({ 
        "studentnumber": $(this).find('td.studentnumber').text(),
        "grade": $(this).find('select.grade').val()
    });
});

console.log(studentnum_array);

如果您想遍历单元格,则必须找到与相应select单元格相关的studentnumber ...

var studentnum_array = [];

$("table tbody td.studentnumber").each(function(index) {
    studentnum_array.push({ 
        "studentnumber": $(this).text(),
        "grade": $(this).closest('tr').find('select.grade').val()
    });
});

console.log(studentnum_array);

答案 1 :(得分:0)

由于您已经遍历每个td,因此您需要找到它tr,然后找到select

 $("table tbody tr td.studentnumber").each(function (index) {
            var grade = $(this).closest('tr').find('select.grade').val();
            studentnum_array.push( {"studentnumber": $(this).text(), "grade": grade } );
        });

         console.log( studentnum_array );