EasyUI 学习笔记汇总.pdfVIP

EasyUI 学习笔记 1．class=easyui-datagrid用于列表展示 2．注释：图中有标有绿色字体的是在图片中显示的图片的样式，比如添加，删除，修改， 保存，取消。 把 jquery easyui下载好之后，一般引用下页 几个文件 引入样式 代码如下: link href=/Resources/easyui/css/default.css rel=style sheet type=text/css / link href=/Resources/easyui/js/themes/default/ea syui.css rel=stylesheet type=text/css / //页面图标样式 link href=/Resources/easyui/js/themes/icon.css rel=stylesheet type=text/css / script src=/Resources/easyui/js/jquery-1.7.2.min. js type=text/javascript/script //jquery easyui 主要的 js script src=/Resources/easyui/js/jquery.easyui.mi n.js type=text/javascript/script 列表展示数据 代码如下: table id=dg title=My Users class=easyui-datagrid style=width: 700px; he ight: 250px url=/GetJson/CreateJson.aspx toolbar=#t oolbar pagination=true rownumbers=true fitcolumns=true singleselect=true thead tr th field=AccountCode width=50 编号 /th th field=AccountName width=50 卡名 /th th field=AccountPwd width=50 密码 /th th field=CreateTime width=50 创建时间 /th th field=CreateName width=50 创建人 /th /tr /thead /table jqueryeasyui是用 datagrid对数据进行展示的，所以 class要选择 easyui-datagrid；url是本列 表的一个 json格式的数据来源 toobar后面跟着的#toobar是列表的一个工具栏，本示例在 列表上显示的是添加，修改，删除功能按钮对数据进行操作。pagination是否显示分页，ro wnumbers 显示行数，分页时向后台传去两个参数，一个就是当前页数另一个就是每页显示 行数；fitcolumns：自适应列宽；singleselected:单选。 工具条代码 代码如下: div id=toolbar