轻量级jquery框架之--工具栏(toolbar)
工具栏需求:
(1)要求工具栏可以通过JSON配置格式生成,这样可以从服务器端控制生成的JSON来控制UI层面的按钮状态
(2)可以自定义按钮的图标样式。
(3)可以定义按钮事件,按钮事件需要支持以字符串形式定义(服务端对应的按钮JSON配置里的事件配置为字符串形式)
(4)支持工具栏全局事件,即点击任意按钮都触发的事件
(5)支持编程方式禁用、启用、添加、删除按钮
(6)支持配置额外的事件参数,考虑参数中附带权限标志
(7)工具栏需要考虑可以简单集成到tree组件、datagrid等可能需要用到工具栏的UI组件中
(8)如果是服务器端生成工具栏方式,为了便于工具栏事件的管理,考虑将工具栏的事件定义到当前页面window对象下的某个事件集合中
工具栏api设计:
一、JOSN配置定义:
全局定义:
var defaultOpts = {
params:{},//用于集成到tree datagrid时 行按钮的数据参数
align: 'left',//对齐方式,默认是left 、center、right
style:'normal',// normal / min / plain
buttons: [], //{}
operated: function () { }//任意按钮事件均触发的事件,优先自身注册的时候然后才调用通用事件,this= a标签
};
单个按钮定义:
buttons=[ {
id: '04', //按钮id
iconCls: '',//图标样式
cmd: 'test',//对应的权限标识
params:{pr1:123},//额外的参数
statu: false,//是否可用
text: '按钮',//文本
click: function (pr) {//点击事件,如果存在click,则字符串形式的handler不可用
},
handler:'字符串形式的事件', //配合methodsObject使用
methodsObject:'window对象下的事件集合名词'
}]
二、api定义

三、工具栏预览

代码下载:
https://code.csdn.net/hjwen/open-ui/tree/master
轻量级jquery框架之--工具栏(toolbar)的更多相关文章
- 轻量级jquery框架之--树(tree)
前言 在常用的UI组件中,树形组件与数据列表组件可以说是构成一个管理平台基本的两大数据核心组件.树形组件用于系统菜单,数据列表用于数据表现,两者配合即可完成一个简单的数据系统.要实现一个支持复选.工具 ...
- 轻量级jquery框架之--布局(layout)
布局需求 (1)支持横向生成布局项即可,不需要纵向生成布局. (2)支持布局项右侧收缩功能 (3)支持自定义布局项图标.标题,并提供动态修改布局项图片和标题的api (4)支持JSON/html/if ...
- 轻量级jquery框架之--面板(panel)
面板需求: (1)支持可拖拽,面板将作为后期的布局组件.window组件.alert组件的基础. (2)支持自定义工具栏,工具栏位置定义在面板底部,工具栏依赖toolbar组件. (3)支持加载JSO ...
- 2016 年 50 个最佳的轻量级 JavaScript 框架和库
作者:IT程序狮链接:https://zhuanlan.zhihu.com/p/24598210来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注明出处. 回顾今年已发布的 JS ...
- c# 轻量级ORM框架 实现(一)
发布一个自己写的一个轻量级ORM框架,本框架设计期初基于三层架构.所以从命名上来看,了解三层的朋友会很好理解. 设计该框架的目的:不想重复的写增删改查,把精力放到功能实现上. 发布改框架的原因:希望给 ...
- jQuery系列 第一章 jQuery框架简单介绍
第一章 jQuery框架简单介绍 1.1 jQuery简介 jQuery是一款优秀的javaScript库(框架),该框架凭借简洁的语法和跨平台的兼容性,极大的简化了开发人员对HTML文档,DOM,事 ...
- 轻量级php框架phpk v1.0发布
phpk框架简介 PHPK是一个简单易用,易于扩展的轻量级PHP框架.phpk不仅仅是一个php框架,也是一个js框架,内置一套全新的js内库,完全摒弃了庞大的jquery,所有的前端都是一个全新的微 ...
- 小谈Jquery框架
现在Jquery框架对于开发人员基本上是无人不知,无人不晓了,用起来十分的方便,特别是选择器十分强大,提高了我们的开发速度.但是好多人也只是停留在了会用的基础上,我个人觉得会用一个框架不算什么,只能说 ...
- 轻量级jQuery语法高亮代码高亮插件jQuery Litelighter。
<!DOCTYPE html><html><head><meta charset="UTF-8" /><title>jQ ...
随机推荐
- ACM ICPC Team
Link: https://www.hackerrank.com/challenges/acm-icpc-team/submissions/code/11617807 def count_max_to ...
- python 远程统计文件
#!/usr/bin/python #encoding=utf-8 import time import os import paramiko import multiprocessing #统计文件 ...
- mapreduce的基本思想
1.什么是mapreduce mapreduce是hadoop自带的分布式计算框架. 2.mapreduce的基本思想 2.1.能够解决什么问题假设一个场景:一个电商系统,统计某个手机号的用户的上行和 ...
- 字典:当索引不好用时2 - 零基础入门学习Python026
字典:当索引不好用时2 让编程改变世界 Change the world by program 上节课我们学习到在一些情况下,比序列更实用的映射类型:字典.我们知道字典也有个关键符号就是大括号(也叫花 ...
- Core Data (二)备
序 上次只是说了三个Core Data栈基本类.这次准备介绍一下常用的类. NSManagedObject Core Data是一次底层数据封装成面向对象的技术.最直接的表现就是在SQLite里面的一 ...
- iOS数据持久化 -- Core Data-备用
Core Data是一个功能强大的层,位于SQLite数据库之上,它避免了SQL的复杂性,能让我们以更自然的方式与数据库进行交互.Core Data将数据库行转换为OC对象(托管对象)来实现,这样无需 ...
- zoj 3772 Calculate the Function
http://acm.zju.edu.cn/onlinejudge/showProblem.do?problemId=5235 这道题需要构造矩阵:F(X)=F(X-1)+F(X-2)*A(X)转化为 ...
- POJ 2986 A Triangle and a Circle
题意:给定一个三角形,以及一个圆的圆心坐标和半径,求圆和三角形的相交面积. 思路: 用三角剖分,三角形上每个线段都变成这个线段与圆心的三角形,然后算出每个三角形与圆的相交面积,然后根据有向面积的正负累 ...
- LeetCode_implement strstr ()
Implement strStr(). Returns a pointer to the first occurrence of needle in haystack, or null if need ...
- KEIL C51 Call Tree
KEIL中函数的调用在其帮助文档中有一个详细的解释,引用如下: The Call Tree The best way to demonstrate how the call tree is gener ...