Home  >  Article  >  Backend Development  >  The paging display in easyui1.5 datagrid is not normal, please give me some advice.

The paging display in easyui1.5 datagrid is not normal, please give me some advice.

WBOY
WBOYOriginal
2016-10-09 08:32:291735browse

1. Problem description: When using easyui1.5, I found that if toolbar is used in datagrid, the paging control in datagrid will not display properly! Go down a few px, as shown in the picture: The paging display in easyui1.5 datagrid is not normal, please give me some advice.

2. Findings after debugging (2 points):
1. There are 2 implementation methods for the datagrid toolbar. The paging display in easyui1.5 datagrid is not normal, please give me some advice.
Not both implementations have the above problems. Only when using the

implementation will problems occur. When using js arrays, everything is displayed normally. 2. As long as you adjust the size of the browser window (shrink a little or enlarge a little), the paging display will be normal immediately. PS: I think the height is not calculated accurately during initialization~~

3. Question code:

<code> <script>
     $(function(){
        $('#category').datagrid({
            url: '{:U("Category/getList")}',
            border: false,
            toolbar: '#tbar',
            fit: true,

            columns:[[
                {field:'id',checkbox:true},
                {field:'sort',title:'排序',width:100},
                {field:'name',title:'栏目名称',width:100},
                {field:'create_time',title:'创建时间',width:100},
            ]],
            pagination: true,

            fitColumns: true,
            rownumbers: true,
            data: [
                {
                    "id": 1,
                    "sort": 1,
                    "name": "助力海东",
                    "create_time": "2016-08-15 15:13:87"
                },
                {
                    "id": 2,
                    "sort": 2,
                    "name": "助力海东",
                    "create_time": "2016-08-15 15:13:87"
                }
            ]
        });
    });
</script>

<table id="category"></table>
<div id="tbar" style="padding: 5px;">
    <a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-add',plain:true">新增</a>
    <a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-edit',plain:true">修改</a>
    <a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-remove',plain:true">删除</a>
</div>
</code>
Please help me if you have the same problem, thank you

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn