我正在制作一个 mvc 结构的网站。该站点显示了一个表格,该表格上有一个工具提示,显示了单元格的更多详细信息。但是,工具提示中的数据未加载。 (除了工具提示一切正常) 这个工具提示数据是从 mySQL 加载的,它有两个输入变量 deptName 和 deptPart。 当我输入随机内容而不是加载数据时,工具提示效果很好......我找不到它出错的原因:(
我的工具提示模型是
function getTooltipML($deptName, $deptPart)
{
$sql = "Call TooltipML('$deptName', '$deptPart')";
$tooltipML = $this->sqlExecution($sql);
return json_encode($tooltipML);
}
function getTooltipWillLeave($deptName, $deptPart)
{
$sql = "Call TooltipWillLeave('$deptName', '$deptPart')";
$tooltipWL = $this->sqlExecution($sql);
return json_encode($tooltipWL);
}
我的工具提示控制器是
function view()
{
$deptName = $_POST['deptName'];
$deptPart = $_POST['deptPart'];
$tooltipML = $this ->model -> getTooltipML($deptName, $deptPart);
$tooltipWL = $this ->model -> getTooltipWillLeave($deptName, $deptPart);
//call view to push the data into the view
$this->requireView('ManagementMasterView', [
'page' => "DashboardDetail",
'tooltipML' =>$tooltipML,
'tooltipWL' => $tooltipWL
]);
}
function tooltip(){
$deptName = $_POST['deptName'];
$deptPart = $_POST['deptPart'];
echo json_encode ($this -> model -> getTooltipML($deptName, $deptPart));
echo json_encode ($this -> model -> getTooltipWillLeave($deptName, $deptPart));
}
我对工具提示的看法是
<div class="dash_table_container">
<?php
// pre-process data
$printedData = json_decode($data['resourceStatus'], true);
$tableHeader = ['deptName', 'deptPart', 'C', 'D', 'E', 'F'];
$tooltipData1 = json_decode($data['tooltipMLEx'], true);
$tooltipData2 = json_decode($data['tooltipWL'], true);
// //Build up a table
table1('dash-tb1', $tableHeader, $printedData, $tooltipData1, $tooltipData2);
?>
</div>
//下面的函数在单独的php文件中,但我只是在此处添加了视图以提高可读性
function table1($tableId, $header, $data, $tooltip1, $tooltip2){
// header build
echo '
<table class="display table table-striped" id="'.$tableId.'">
<thead>
<tr class="table-primary">
<th>#</th>';
foreach ($header as $columnVal){
echo '<th>'.$columnVal.'</th>';
}
echo '
</tr>
</thead>
<tbody>';
$index = 0;
$tooltip1 = "";
$tooltip2 = "";
foreach ($data as $row){
$tooltip1;
$tooltip2;
$index++;
echo '
<tr id="'.$row['deptName'].'" data-id="'.$row['deptPart'].'">
<td>'.$index.'</td>
<td>'.$row['deptName'].'</td><td>'.$row['deptPart'].'</td><td>'.$row['C'].'</td>
<td class = "CellWithComment"><span class="CellComment">'.$tooltip1.'</span>'.$row['D'].'</td>
<td class = "CellWithComment"><span class="CellComment">'.$tooltip2.'</span>'.$row['E].'</td>
<td>'.$row['F'].'</td>';
}
echo '
</tr>
</tbody>
</table>';
}
我的 javascript 是
$(document).ready(function(){
// Add tooltip
$('.CellComment').tooltip({
delay: 500,
placement: "bottom",
title: tooltipDetails,
html: true
});
});
// Get employee details for tooltip
function tooltipDetails(deptName, deptPart){
var deptName = this.deptName;
var deptPart = $(this).attr('data-id');
var tooltipText = "";
$.ajax({
url: '/hrmsystem/Dashboard/tooltip',
method: "POST",
data: {dept_Name:deptName, dept_Part:deptPart},
dataType: "JSON",
async: false,
success: function(response){
tooltipText = response;
}
});
return tooltipText;
}
非常感谢您的提示。