zoukankan      html  css  js  c++  java
  • EasyUI学习笔记

    学习链接:http://www.jeasyui.net/tutorial

    1.CRUD的实现-不使用可编辑的datagrid

    (1) 使用到的插件:

    • datagrid:向用户展示列表数据。
    • dialog:创建或编辑一条单一的用户信息。
    • form:用于提交表单数据。
    • messager:显示一些操作信息。

    (2) 查询的实现使用datagrid进行结果显示,与其关联的url及后端的处理器方法负责从数据库中检索数据,并转为json格式返回。

    (3) 新建和编辑一条记录的实现使用同一个dialog,这个dialog包含一个form,form提交数据的url需根据新建或编辑动态设置,从而当点击dialog的save按钮时form数据被提交到不同的url进行处理。当点新建按钮时,需清空form数据;当点击编辑按钮时,需加载选定的数据行到form中。

    (4) 当点击删除按钮时,弹出一个消息框提示用户确认是否删除,如果是则获取选择数据的id post到后端的url进行删除处理。

    2.CRUD的实现-使用可编辑的datagrid

    (1)为可编辑列提供editor属性;

    (2)提供new、save、cancel、destroy四个按钮和相应的onclick事件处理,

    (3)提供 'url'、'saveUrl'、'updateUrl' 和 'destroyUrl' 属性来编辑数据网格(DataGrid),并提供相应的后端处理方法。

    3.表单验证

    (1)在<input>标签中使用easyui-validatebox的class属性;

    (2)使用required和validType等属性指定校验规则;

    (3)在表单提交时指定onSubmit事件发生时做表单验证。

    4.分页

    (1)定义数据网格(datagrid)列,并设置 'pagination' 属性为 true,它将在数据网格(datagrid)的底部生成一个分页(pagination)工具栏。pagination将发送两个参数到服务器:

    • page:页码,起始值 1。
    • rows:每页显示行。

    (2)后端service根据查询条件和分页条件获取数据:total:未分页的记录总数,rows:分页查询结果。

    一、后端获取分页数据的一般方法

    a.根据查询条件(不加分页条件)构造count(*) sql语句查询出total

    b.根据查询条件和分页条件构造另一个sql语句查询出分页结果rows

    二、利用PageHelper获取分页数据

    a.调用PageHelper.startPage,传入前端发送的参数page和rows,开始分页;

    b.根据查询条件(不加分页条件)查询出结果resultList;

    c.根据查询结果构造PageInfo<?>实例,即为分页结果。

    (3)后端conctoller将service查询出的total和rows转为json结果返回前端datagrid.

  • 相关阅读:
    Android开源框架——Volley
    Android中的事件传递机制
    @ViewDebug.ExportedProperty的使用
    字符间距——扩展
    读取assets文件夹下图片(ods_interview)
    Android消息推送——JPush极光推送
    深入模块
    正则表达式和re模块
    初识模块
    迭代器和生成器
  • 原文地址:https://www.cnblogs.com/cloudwind2011/p/10438329.html
Copyright © 2011-2022 走看看