如何使用jQuery DataTables捕获所选行中的数据 [英] how to capture the data in a selected row using jQuery DataTables

问题描述

我有这个数据设置：

  $（document）.ready（function（）{
 $ '#RectifiedCount'）dataTable（{
bJQueryUI：true，
bProcessing：true，
aLengthMenu：[[10，25，50，-1] 10，25，50，全部]]，
bStateSave：true，
sDom：<Hif> tr<FlTp>'，
aoColumns：[
 {'sname'：'count_id'，'sType'：'numeric'，'bVisible'：false}，
 {'sName'：'count_type'，'sType' ：'string'，'bVisible'：true}，
 {'sName'：'count_date'，'sType'：'date'，'bVisible'：true}，
 {'sName' count_count'，'sType'：'numeric'，'bVisible'：true}，
 {'sName'：'count_notes'，'sType'：'string'，'bVisible'：true} 
] ，
oTableTools：{
sRowSelect： single，
sSwfPath：media / swf / copy_cvs_xls_pdf.swf，
aButtons：[{sExtends：'select_none'，'sButtonText'：'Clear Selection'}]，
fnRowSelected：function（node）{
 var s = $（node）.children（）; 
 if（$（s [0]）。text（）=='D​​elivery'）return; 
 $（'select [name =count_type]'）。val（$（s [0]）。text（））; 
 $（'input [name =count_date]'）。val（$（s [1]）。text（））; 
 $（'input [name =count_count]'）。val（$（s [2]）。text（））; 
 $（'textarea [name =count_notes]'）。val（$（s [3]）。text（））; 
} 
}，
'sScrollX'：'100％'
}）; 
}）; 
  

当我选择一行时，我想将该行的单元格的值复制到某种形式名称与sName属性相同的字段。我有两个问题：

• 是否有一个TableTools方法来访问所选行中单元格的值？像 node ['sName_whatever']。value 会很好。


• 如何获取单元格的值，其中bVisible =虚假？

ETA解决方案

（忽略不重要的东西） / p>

  $（document）.ready（function（）{
 rctable = $（'＃RectifiedCount'）。dataTable {
aoColumns：[
 {'sname'：'count_id'，'sType'：'numeric'，'bVisible'：false}，
 {'sName'：'count_type' ，'sType'：'string'，'bVisible'：true}，
 {'sName'：'count_date'，'sType'：'date'，'bVisible'：true}，
 {' sName'：'count_count'，'sType'：'numeric'，'bVisible'：true}，
 {'sName'：'count_notes'，'sType'：'string'，'bVisible' b $ b]，
oTableTools：{
sRowSelect：单个，
fnRowSelected：function（node）{
 aData = rctable.fnGetData（node）; //好的数组单元格值
 if（aData [0] =='Delivery'）return; 
 $（'select [name =count_type]'）。val（aData [0]）; 
 $（'input [name =count_date]'）。val（aData [1]）; 
 $（'input [name =count_count]'）。val（aData [2]）; 
 $（'textarea [name =count_notes]'）。val（aData [3]）; } 
} 
}）; 
}）; 
  

解决方案

我做了以下：

  oTable = $（'＃RectifiedCount'）。dataTable（....）; 
 
 $（'＃RectifiedCount tbody tr'）。live（'click'，function（event）{
 var aData = oTable.fnGetData（this）; // get datarow 
 if（null！= aData）// null如果我们点击标题行
 {
 // now aData [0]  - 第一列（count_id），aData [1] -2nd等
} 
}）; 
  

I have this datatable setup:

$(document).ready(function() {
    $('#RectifiedCount').dataTable( {
        "bJQueryUI": true,
        "bProcessing": true,
        "aLengthMenu": [[10, 25, 50, -1], [10, 25, 50, "All"]],
        "bStateSave": true,
        "sDom": '<"H"if>tr<"F"lTp>',
        "aoColumns":[
                     {'sname':'count_id', 'sType':'numeric', 'bVisible':false},
                     {'sName':'count_type', 'sType':'string','bVisible':true},
                     {'sName':'count_date', 'sType':'date','bVisible':true},
                     {'sName':'count_count', 'sType':'numeric','bVisible':true},
                     {'sName':'count_notes', 'sType':'string','bVisible':true}
                     ],
        "oTableTools": {
            "sRowSelect": "single",
            "sSwfPath": "media/swf/copy_cvs_xls_pdf.swf",
            "aButtons": [ {sExtends :'select_none' , 'sButtonText':'Clear Selection'}],
            "fnRowSelected": function(node){
                var s=$(node).children();
                if($(s[0]).text()=='Delivery') return ;
                $('select[name="count_type"]').val($(s[0]).text());
                $('input[name="count_date"]').val($(s[1]).text());
                $('input[name="count_count"]').val($(s[2]).text());
                $('textarea[name="count_notes"]').val($(s[3]).text());
            }
        },
        'sScrollX':'100%'
    });
});

When I select a row, I want to copy the values of the cells of that row into some form fields that are named the same as the 'sName' attributes. I have 2 questions:

• is there a TableTools method for accessing the value of a cell in a selected row? Something like node['sName_whatever'].value would be nice.
• how can I get the value of the cells where bVisible=false?

ETA solution

(leaving out the unimportant stuff)

$(document).ready(function() {
    rctable=$('#RectifiedCount').dataTable( {
        "aoColumns":[
                     {'sname':'count_id', 'sType':'numeric', 'bVisible':false},
                     {'sName':'count_type', 'sType':'string','bVisible':true},
                     {'sName':'count_date', 'sType':'date','bVisible':true},
                     {'sName':'count_count', 'sType':'numeric','bVisible':true},
                     {'sName':'count_notes', 'sType':'string','bVisible':true}
                     ],
        "oTableTools": {
            "sRowSelect": "single",
            "fnRowSelected": function(node){
                aData = rctable.fnGetData(node); //nice array of cell values
                if(aData[0]=='Delivery') return ;
                $('select[name="count_type"]').val(aData[0]);
                $('input[name="count_date"]').val(aData[1]);
                $('input[name="count_count"]').val(aData[2]);
                $('textarea[name="count_notes"]').val(aData[3]);            }
        }
    });
});

解决方案

I did the following:

 oTable = $('#RectifiedCount').dataTable( ....);

 $('#RectifiedCount tbody tr').live('click', function (event) {        
    var aData = oTable.fnGetData(this); // get datarow
    if (null != aData)  // null if we clicked on title row
    {
        //now aData[0] - 1st column(count_id), aData[1] -2nd, etc. 
    }
});

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