day04-easyUId atagrid使用方法-使用easyUI提供的API创建datagrid

<!-- 方式三：使用easyUI提供的API创建datagrid -->

         <script type="text/javascript">

                   $(function(){

                            //页面加载完成后，创建数据表格datagrid

                            $("#mytable").datagrid({

                                     //定义标题行所有的列

                                     columns:[[

                                               {title:'编号',field:'id',checkbox:true},

                                               {title:'姓名',field:'name'},

                                               {title:'年龄',field:'age'},

                                               {title:'地址',field:'address'}

                                               ]],

                                     //指定数据表格发送ajax请求的地址

                                     url:'${pageContext.request.contextPath}/json/datagrid_data.json',

                                     rownumbers:true,

                                     singleSelect:true,

                                     //定义工具栏

                                     toolbar:[

                                              {text:'添加',iconCls:'icon-add',

                                                 //为按钮绑定单击事件

                                                 handler:function(){

                                                        alert('add...');

                                               }

                                              },

                                              {text:'删除',iconCls:'icon-remove'},

                                              {text:'修改',iconCls:'icon-edit'},

                                              {text:'查询',iconCls:'icon-search'}

                                              ],

                                     //显示分页条

                                     pagination:true

                            });

                   });

         </script>

 

如果数据表格中使用了分页条，要求服务端响应的json变为：