jTable基础知识：画表格之前要做的事

• jQuery jTable
  • 起手式
  • 建立jTable的javascript代码
    • 定义
      • 通用属性
      • 操作属性
      • 列属性
      • 事件处理

jQuery jTable

上周补充了一些关于jQuery的基础背景知识，现在来了解一下jTable这个基于jQuery的插件。

典型的AjaxCRUD表——jTable

 

 

起手式

• jTable的必备js，css需要import到对应的jsp中
• 在jsp中，插入jTable的地方预留一个空<div>
• <div id="MyTableContainer"></div>
• 然后，插入一段js代码

建立jTable的javascript代码

<script type="text/javascript">

    $(document).ready(function () {        

       $('#MyTableContainer').jtable({

              

            //通用属性

  

            actions: {

                //操作定义

            },

            fields: {

                //列属性定义

            }

  

            //事件处理

        });    

    });

</script>

定义

通用属性

这里是一些全局的属性。比如是否分页，每页记录数量，排序方式等等

操作属性

定义服务器与客户端浏览器之间的交互

action一共有四种

1. listAction
2. createAction
3. updateAction
4. deleteAction

分别对应了 显示（查找项目），增加项目，更新项目，删除项目即CRUD

没有listAction的话，jTable只会建立一个空表格

列属性

和关系数据库中记录所拥有的列对应，包含显示的一些属性，标题等

例如：title，width，create，edit，display，options等等

事件处理

诸如建立记录，删除记录，载入记录等事件以及对应的响应

• jQuery jTable
  • 起手式
  • 建立jTable的javascript代码
    • 定义
      • 通用属性
      • 操作属性
      • 列属性
      • 事件处理

jQuery jTable

上周补充了一些关于jQuery的基础背景知识，现在来了解一下jTable这个基于jQuery的插件。

典型的AjaxCRUD表——jTable

 

 

起手式

• jTable的必备js，css需要import到对应的jsp中
• 在jsp中，插入jTable的地方预留一个空<div>
• <div id="MyTableContainer"></div>
• 然后，插入一段js代码

建立jTable的javascript代码

<script type="text/javascript">

    $(document).ready(function () {        

       $('#MyTableContainer').jtable({

              

            //通用属性

  

            actions: {

                //操作定义

            },

            fields: {

                //列属性定义

            }

  

            //事件处理

        });    

    });

</script>

定义

通用属性

这里是一些全局的属性。比如是否分页，每页记录数量，排序方式等等

操作属性

定义服务器与客户端浏览器之间的交互

action一共有四种

1. listAction
2. createAction
3. updateAction
4. deleteAction

分别对应了 显示（查找项目），增加项目，更新项目，删除项目即CRUD

没有listAction的话，jTable只会建立一个空表格

列属性

和关系数据库中记录所拥有的列对应，包含显示的一些属性，标题等

例如：title，width，create，edit，display，options等等

事件处理

诸如建立记录，删除记录，载入记录等事件以及对应的响应