jQuery数据表从所选行中获取数据 [英] jquery data tables get data from selected rows

问题描述

我有一个jquery datatable，并有复选框，将所选行的行设置为所选择的行。但是，当我尝试从这些选定的行中获取第一列数据时，它会给我一些对象。

我无法通过一些在数据表和堆栈溢出论坛上的主题的帖子。

代码如下。

，
Arjun

HTML：

 < table id =mytableclass =table table-striped table-borderedcellspacing =0width =100％> 
 
< thead> 
< tr> 
< th>< input type =checkboxname =check_allid =check_all/>< / th> 
< th>请求ID< / th> 
< th>请求日期< / th> 
< th>离开类型< / th> 
< th>开始日期< / th> 
< th>结束日期< / th> 
< th>状态< / th> 
< / tr> 
< / thead> 
< / table> 
  

Javscript

  $（＃check_all）。click（function（）{
 $（。checkBoxClass）。prop（'checked'，$（this）.prop（'checked'））; 
}）; 
 
 $（。checkBoxClass）。change（function（）{
 if（！$（this）.prop（checked））{
 $（check_all ）.prop（checked，false）; 
 $（this）.closest（'tr'）。removeClass（'row_selected'）; 
} 
 $（this）.closest （'tr'）。addClass（'row_selected'）; 
}）; 
 
函数sendval（）{
 var apprReq = []; 
 var rejReq = []; 
 
 var otable = $（'＃mytable'）。DataTable（）; 
 var aTrs = otable.rows（）; 
 
 for（var i = 0; i  {
 if（$（aTrs [i]）。hasClass（'row_selected'））
 {
 apprReq.push（aTrs.rows（）。data [i]）; 
} 
 rejReq.push（aTrs [i]）; 
} 
 console.log（apprReq）; 
 console.log（rejReq）; 
 
} 
  

解决方案

doc 您可以执行以下操作：

  var table = $（'＃mytable'）。DataTable（）; 
 var rows_selected = table.rows（'。row_selected'）。data（）; 
 $ .each（rows_selected，function（i，v）{
 apprReq.push（v）; 
}）; 
  

I have a jquery datatable, and have checkboxes which set the row selected class to the rows which are selected. However when I try to get the first column data from these selected rows, it gives me objects.

I am unable to get to the problem inspire of going through a number of posts on the subjects on the data tables and stack overflow forums.

The codes are provided below.

Regards, Arjun

HTML:

<table id="mytable" class="table table-striped table-bordered" cellspacing="0" width="100%">

    <thead>
            <tr>
                <th><input type="checkbox" name= "check_all" id="check_all"/></th>
                <th>Request ID</th>
                <th>Request Date</th>
                <th>Leave Type</th>
                <th>Start Date</th>
                <th>End Date</th>
                <th>Status</th>
            </tr>
        </thead>
    </table>

Javscript

$("#check_all").click(function () {
    $(".checkBoxClass").prop('checked', $(this).prop('checked'));
});

$(".checkBoxClass").change(function(){
    if (!$(this).prop("checked")){
        $("check_all").prop("checked",false);
        $(this).closest('tr').removeClass('row_selected');
    }
        $(this).closest('tr').addClass('row_selected');
});

function sendval(){
    var apprReq = [];
    var rejReq = [];

    var otable = $('#mytable').DataTable();
    var aTrs = otable.rows();

    for ( var i=0 ; i<aTrs.length ; i++ )                                       
    {
        if ( $(aTrs[i]).hasClass('row_selected') )
        {
            apprReq.push( aTrs.rows().data[i] );
        }
            rejReq.push( aTrs[i] );
    }
    console.log(apprReq);
    console.log(rejReq);

}

解决方案

from datables doc you can do:

var table = $('#mytable').DataTable();
var rows_selected = table.rows('.row_selected').data();
$.each(rows_selected,function(i,v){
    apprReq.push(v);
});

这篇关于jQuery数据表从所选行中获取数据的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！