代码之家 › 专栏 › 技术社区 › Pavlo Chechehov

我可以在JavaSpring + SutheleAF项目中使用制表器JS库吗?

tabulator thymeleaf spring java javascript

Pavlo Chechehov · 技术社区 · 6 年前

我想在我的Java项目中添加制表器JS。我在resources文件夹中添加了tabulator.min.js、tabulator.min.css。之后,将这些依赖项添加到我的HTML页面中,作为readme.md中的建议。

<script type=“text/javascript”th:src=“@/js/tabulator.min.js”></script>>pre>

现在,我的表可以查看HTML页面中的所有元素,但不正确。

在制表器文档中举例说明了如何创建表头和表,

var table=new制表器(“示例表”,{
列:[
标题:“名称”,字段:“名称”,排序器:“字符串”,宽度:200,编辑器:真,
标题:“年龄”,字段:“年龄”,排序器:“数字”,对齐:“右”,格式设置器:“进度”,
标题:“性别”,字段:“性别”,排序器:“字符串”,单元格单击:函数(e,单元格)console.log(“单元格单击”),,
标题:“高度”,字段:“高度”,格式设置工具:“星形”,对齐:“中心”,宽度:100,
标题:“最喜欢的颜色”,字段:“col”,排序器:“string”,
标题:“出生日期”,字段:“出生日期”,排序器:“日期”,对齐:“中心”,
标题:“奶酪偏好”,字段:“奶酪”,排序器:“布尔”,对齐:“中心”,格式设置器:“勾选”,
,
});


   
    
     但我想用HTML创建标题,这是可能的吗?
    
    
     并将数据从控制器放入服务器端部分,而不是
    
    
    
    
     
      var data=[
ID:1,姓名:“Oli Bob”,年龄:“12”,颜色:“红色”,出生日期:“,
ID:2,姓名:“Mary May”,年龄:“1”,颜色:“蓝色”,出生日期:“14/05/1982”,
ID:3,姓名:“Christine Lobowski”,年龄:“42”,颜色:“绿色”,出生日期:“22/05/1982”,
ID:4,姓名:“Brendon Philips”,年龄:“125”,颜色:“Orange”,出生日期:“01/08/1980”,
ID:5,姓名:“Margret Marmajuke”,年龄:“16”,颜色:“黄色”,出生日期:“31/01/1999”,
 < /PRE>

     
    
    
     
      
     
    
    
     
      
      .
     
     
      
      
     
    
    
    
    
     
      
       <link rel="stylesheet" th:href="@{/css/tabulator.min.css}">
<script type="text/javascript" th:src="@{/js/tabulator.min.js}"></script>
      
     
    
    
     
      现在,我的表查看了HTML页面中的所有元素,但不正确。
     
     
      在制表器文档中举例说明了如何创建表头和表,
     
     
     
     
      
       var table = new Tabulator("#example-table", {
    columns:[
        {title:"Name", field:"name", sorter:"string", width:200, editor:true},
        {title:"Age", field:"age", sorter:"number", align:"right", formatter:"progress"},
        {title:"Gender", field:"gender", sorter:"string", cellClick:function(e, cell){console.log("cell click")},},
        {title:"Height", field:"height", formatter:"star", align:"center", width:100},
        {title:"Favourite Color", field:"col", sorter:"string"},
        {title:"Date Of Birth", field:"dob", sorter:"date", align:"center"},
        {title:"Cheese Preference", field:"cheese", sorter:"boolean", align:"center", formatter:"tickCross"},
    ],
});
      
     
     
      但我想用HTML创建标题,这是可能的吗?
     
     
      并将数据从控制器放入服务器端部分,而不是
     
     
     
     
      
       var data = [
  {id:1, name:"Oli Bob", age:"12", col:"red", dob:""},
  {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"},
];

1 回复 | 直到 6 年前

Oli Folkerd 6 年前

制表器设计用于创建交互式javascript表,而不是输出简单的HTML表。