a. jQuery Easyui js框架:
1. 添加一个选项卡: $().tabs('add',{title: '标题', content: '正文'});
2. 弹出警告窗口,消息窗口,$.messager.alert("标题","内容","warning");
警告: alert() 确认confirm("","",function(result){})
输入 prompt("","",function(result){})
右下角出框口: show({title:"" msg:"" timeout: showType:""})
3. $().window.open(); 4.校验框: validatebox
4. dategrid 进行表格设置, 设置列名: columns 二级数组的格式;
url : 发送请求 pagination 分页工具条
toolbar: 一维数组定义按钮
5. datagrid 数据分页原理: 页面加载就会向后台发送请求 : page 和rows
需要接收的参数: total ; , rows: 当前页数据
6. getselected 返回第一个选中的行记录 getSelections : 返回所有选定的行;
获取选择行的索引 getrowIndex 表格中插入新的数据: insertRow
7. load 重新装载表单; 参数为json 格式
8.class= easyui-combobox 下拉列表框: url:..... "
data-options="valueField:向后台发送的数据, textField: 显示内容字段名
9. formatter 使用: 定制内容 formatter: function(当前属性对应
json数据中值,rowdata: 当前行数据, rowIndex: 第几行)
10. 快速录入功能, 列属性: editor : { type: 类型 options: 类型的属性}
工具栏: handler : function() { $(id).datagrid("beginEdit",index) }
编辑后,进行选择 endEdit,保存 cancelEdit 取消
事件处理: onbeforEdit 由beginedit触发 , endedit 保存成功后触发 onafterEdit, canceledit 触发 oncanceledit;
b. Ztree 树性菜单技术: 两种数据格式
1. 标准json数据 var nodes=[ {name: '父节点1', children:[{ name: '子节点1', {name:'字节点2'}}]}]
2. 简单json数据: var nodes=[{自己的id : 1, 父节点的pid: 0,
name:"父节点或子节点"}]
编写步骤: 1. 显示菜单 , 只需要加一个class="ztree"2. 开启简单数据格式支持
3.编写树形菜单数据: 定义一个简单json数组
3. 生成树形菜单 $.fn.ztree.init();
2.前端页面展示:
bootStrap 响应式 + Angular js前端 UI框架
Angular Js 最为核心: MVVM, 模块化, 自动化双向数据绑定,依赖注入,
内部指令, 语义化标签
ng-app: 程序入口,对该标签内的元素进行初始化, 代表 angular 应用作域
ng-controller: 在当前元素范围内绑定指定的控制器
ng-model: 指定当前元素与数据模型($scope) 中的属性绑定,
ng-repeat: 循环$scope中的属性
{{ }} : 两个花括号表示读取某一个属性值
a. 双向数据绑定: 更新模型, 视图会自动更新, 更新视图,模型会自动更新
b. AngularJs 基于模块化实现 MVC案例
ng-model 比如说在一个输入框, 输入框的name就是一个model
输入框显示内容 {{name}} 就是 view
js代码 模块.controller("控制名",["$scope",function(scope){
可以得到name ,从而进行控制赋值}])
c. 集合遍历 : ng-repeat="product in products"
d. AngularJs 路由的使用: 路由使用(页面架构) 搭建单页面工程的框架;
在页面内部 : 通过#/ 页面名称, 就可以映射到访问正文内容,
基于ajax的方法来加载其他页面;
<a href="#/">用户管理</a> ---> 显示路由调用的页面: <div ng-view> --->
js代码 myapp.config(["$routeprovider",function(x){x.when("/",{templateUrl}) }])