我正在开发特定用户的历史开发,我希望用dataTables完成.但是,我找不到可以使我的行或特定单元格可点击的方式.我需要为特定行单独点击打开单独的链接.任何帮助,将不胜感激.提前致谢 !!!
编辑::如果我点击一行,我需要该行的所有数据,这不是问题.我能做到.我需要知道的是使用该特定行数据生成$.ajax()请求.我想这会做.但是,知道如何在行单击的新选项卡中打开链接会很棒.
$(document).ready(function() { var dataSet = [ [] ]; $.ajax({ type: 'POST',url: "webservices/view_patient_medical_history.PHP",async: false,//data: {'log_id': data},success: function(response) { dataSet = JSON.parse(response); } }); // var dataSet_arr = jQuery.makeArray(dataSet['responseText']); $('#patient_medical_history').DataTable({ data: dataSet,columns: [{ title: "Patient ID",class: "center" },{ title: "Current Medications",{ title: "Allergies",{ title: "Diabetes",{ title: "Asthma",{ title: "Arthritis",{ title: "High Blood Pressure",{ title: "Kidney Problem",{ title: "Liver Problem",{ title: "Heart Problem",{ title: "Other Problems",{ title: "Present Problem",{ title: "Last Updated",class: "center" }],"scrollX": true,//"paging": false,"info": false,//"lengthMenu": false,dom: 'lBfrtip',buttons: [ 'copy','pdf','print' ] /*"paging": false,dom: 'Bfrtip',buttons: [ 'excel','print' ]*/ }); $('th').css("white-space","nowrap"); });
解决方法
要激活单击单元格,您必须使用委派的事件处理程序 – 这将适用于任何dataTable:
$('.dataTable').on('click','tbody td',function() { //get textContent of the TD console.log('TD cell textContent : ',this.textContent) //get the value of the TD using the API console.log('value by API : ',table.cell({ row: this.parentNode.rowIndex,column : this.cellIndex }).data()); })
检索单击行的数据可以通过执行
$('.dataTable').on('click','tbody tr',function() { console.log('API row values : ',table.row(this).data()); })
如果要通过AJAX发送行内容,则应将数组转换为对象,然后将其作为数据包含:
$('.dataTable').on('click',function() { var data = table.row(this).data().map(function(item,index) { var r = {}; r['col'+index]=item; return r; }) //now use AJAX with data,which is on the form [ { col1 : value,col2: value ..}] $.ajax({ data: data,url: url,success: function(response) { ... } })
如果您只想在带有target:_blank的单元格中使用普通链接,则可以使用render:
columns: [ { title: "Patient ID",class: "center",render: function(data,type,full,Meta) { return '<a href="showdata/id?'+data+'" target=_blank>Show patient</a>' } },