Question

我正在使用creating a table处理jTable plugin表单。我试图用PHP实现它。我＆＃39; v下载示例文件，它工作正常。

问题是：当我执行代码时，表格没有"go to page area"。我尝试解决在客户端代码中更改Html的Head Section文件的问题。所以我下载了jquery，jquery-ui和jtable的最新版本。我不确定问题是在客户端代码还是在文件中Jquery，jquery-ui它尊重我下载的.css和.js文件。

这是我的代码：

<html>
  <head>
    <link rel="stylesheet" href="jquery-ui-1.11.2/jquery-ui.css" />
    <link href="Scripts/jtable/themes/lightcolor/blue/jtable.css" rel="stylesheet" type="text/css" />

    <script src="scripts/jquery-1.11.1.js"></script>
    <script src="scripts/jquery-ui-1.8.16.custom.min.js"></script>  
    <script src="Scripts/jtable/jquery.jtable.js" type="text/javascript"></script>
  </head>
  <body>
    <div id="PeopleTableContainer" style="width: 600px;"></div>
    <script type="text/javascript">

        $(document).ready(function () {
            //Prepare jTable
            $('#PeopleTableContainer').jtable({
                title: 'Table of people',
                paging: true,
                pageSize: 2,
                gotoPageArea: 'combobox',
                pageSizes: {10,25,50,100,250,500},
                pageSizeChangeArea: true,
                sorting: true,
                defaultSorting: 'Name ASC',
                actions: {
                    listAction: 'PersonActionsPagedSorted.php?action=list',
                    createAction: 'PersonActionsPagedSorted.php?action=create',
                    updateAction: 'PersonActionsPagedSorted.php?action=update',
                    deleteAction: 'PersonActionsPagedSorted.php?action=delete'
                },              
                fields: {
                    PersonId: {
                        key: true,
                        create: false,
                        edit: false,
                        list: false
                    },
                    Name: {
                        title: 'Author Name',
                        width: '40%'
                    },
                    Age: {
                        title: 'Age',
                        width: '20%'
                    },
                    RecordDate: {
                        title: 'Record date',
                        width: '30%',
                        type: 'date',
                        create: false,
                        edit: false
                    }
                }
            });

            //Load person list from server
            $('#PeopleTableContainer').jtable('load');

        });

    </script>

  </body>
</html>

Answer 1

下载示例文件的原因，不要响应命令＆＃34; goToPageArea＆＃34;是主题的原因，一些主题没有这个功能。为了解决我的问题，我直接从author-syte下载了主题文件。

jTable头部分文件

1 个答案: