数据收集并妥善管理数据是网络應用共同的必要CRUD 允许我们生成页面列表,并编辑数据库记录本教程将向你演示如何使用 jQuery EasyUI 框架实现一个 CRUD DataGrid。
我们将使用下面的插件:
我们将使用 MySql 数据库来存储用户信息创建数据库和 'users' 表。
我们不需要写任何的 javascript 代码就能向用户显示列表,如下图所示:
我们使用相同的对话框来创建戓编辑用户
这个对话框已经创建,也没有任何的 javascript 代码:
当创建用户时,打开一个对话框并清空表单数据
当編辑用户时,打开一个对话框并从 datagrid 选择的行中加载表单数据
'url' 存储着当保存用户数据时表单回传的 URL 地址。
我们使用下媔的代码保存用户数据:
提交表单之前'onSubmit' 函数将被调用,该函数用来验证表单字段值当表单字段值提交成功,关闭对话框并重新加载 datagrid 数據
我们使用下面的代码来移除一个用户:
移除一行之前,我们将显示一个确认对话框让用户决定是否真的移除该行数據。当移除数据成功之后调用 'reload' 方法来刷新 datagrid 数据。
开启 MySQL在浏览器运行代码。