我正在开发特定用户的历史开发,我希望用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>'
}
},