我正在尝试快速入门示例,只是为了熟悉Tabulator。 我从示例中逐字复制了代码。 当我加载表格时,行与表格的高度相同。即一次只能看到一行。 在我的一生中,我无法弄清楚如何自动调整行,甚至无法将行设置为固定高度。
本地服务器:EasyPHP Devserver 17.0 浏览器:Chrome(最新) 制表符:4.2
我添加了布局:“ fitData”,但这只会影响列 我尝试使用max-height而不是height。
//sample data
var tabledata = [{
id: 1,
name: "Oli Bob",
age: "12",
col: "red",
dob: "12/08/2017"
},
{
id: 2,
name: "Mary May",
age: "1",
col: "blue",
dob: "14/05/1982"
},
{
id: 3,
name: "Christine Lobowski",
age: "42",
col: "green",
dob: "22/05/1982"
},
{
id: 4,
name: "Brendon Philips",
age: "125",
col: "orange",
dob: "01/08/1980"
},
{
id: 5,
name: "Margret Marmajuke",
age: "16",
col: "yellow",
dob: "31/01/1999"
},
];
var table = new Tabulator("#example-table", {
height: 400, // set height of table to enable virtual DOM
data: tabledata, //load initial data into table
resizableRows: true,
layout: "fitData",
//layout:"fitColumns", //fit columns to width of table (optional)
columns: [ //Define Table Columns
{
title: "Name",
field: "name",
sorter: "string",
width: 150
},
{
title: "Age",
field: "age",
sorter: "number",
align: "left",
formatter: "progress"
},
{
title: "Favourite Color",
field: "col",
sorter: "string",
sortable: false
},
{
title: "Date Of Birth",
field: "dob",
sorter: "date",
align: "center"
},
],
rowClick: function(e, id, data, row) { //trigger an alert message when the row is clicked
alert("Row " + id + " Clicked!!!!");
},
});
<!DOCTYPE html>
<html lang="en">
<head>
<link href="https://unpkg.com/tabulator-tables@4.2.7/dist/css/tabulator.min.css" rel="stylesheet">
<script type="text/javascript" src="https://unpkg.com/tabulator-tables@4.2.7/dist/js/tabulator.min.js"></script>
</head>
<body>
<div id="example-table"></div>
</body>
</html>
答案 0 :(得分:0)
这好吗?
SELECT e.DepartmentId,
AVG(RatingId) as average_rating
FROM Employee e LEFT JOIN
PerformanceReviewRatings pfr
ON pfr.EmployeeId = e.Id AND
pfr.AppraisalId = 1009
GROUP BY e.DepartmentId