jQuery LigerUI API预览版发布

 

插件方法列表
ligerAccordion()
  • 应用面板
ligerCheckBox(p)
  • 可以将一个复选框的表单对象转换成自定义复选框。
ligerComboBox(p)
  • 1,可以将一个type=Select的表单对象转换成自定义下拉框。
  • 2,可以将一个type=text的表单对象转换成自定义下拉框(需要配置数据源)。
  • 3,可以将一个Dom容器(如div)对象转换成自定义下拉框(需要配置数据源)。
ligerDateEditor(p)
  • 可以将一个'文本框'的表单对象转换成可日期选择。
ligerDrag(p)
  • 使目标对象可以拖动。
ligerForm()
  • 应用自定义表单
ligerFrom()
  • 可以将一个表单转换成自定义表单。
ligerGrid(p)
  • 1,支持本地数据和服务器数据(配置data或者url)
  • 2,支持排序和分页(包括Javascript排序和分页)
  • 3,支持列的“显示/隐藏”
  • 4,支持明细行(表格内嵌)
  • 5,支持汇总行
  • 6,支持单元格模板
  • 7,支持编辑表格(ligerGrid的一个特色,需要其他表单插件的支持)
  • 8,支持树表格(待加入)
  • 8,支持分组(待加入)
ligerLayout(p)
  • 应用Layout
ligerMessageBoxAlert(title, content, onBtnClick)
  • 显示提示弹出框
ligerMessageBoxconfirm(title, content, callback)
  • 确定框
ligerMessageBoxError(title, content, onBtnClick)
  • 显示失败弹出框
ligerMessageBoxQuestion(title, content, onBtnClick)
  • 显示问题弹出框
ligerMessageBoxShow(p)
  • 显示弹出框
ligerMessageBoxSuccess(title, content, onBtnClick)
  • 显示成功弹出框
ligerMessageBoxWarn(title, content, onBtnClick)
  • 显示警告弹出框
ligerRadio()
  • 可以将一个单选框的表单对象转换成自定义单选框。
ligerResizable(p)
  • 使目标对象可以调整大小。
ligerSpinner(p)
  • 可以将一个'文本框'的表单对象转换成可调整
ligerTab()
  • 应用Tab
ligerWindowShow(p)
  • 弹出窗口。
插件方法详细
{jQuery} ligerAccordion()
描述:
  • 应用面板
返回值:
{jQuery} jQuery对象
{jQuery} ligerCheckBox(p)
描述:
  • 可以将一个复选框的表单对象转换成自定义复选框。
参数列表:
参数名 类型 描述 默认值
p {Object} 主要参数  
p.onBeforeClick {Function} 点击前事件
  • 参数1：复选框Dom对象
返回值:
{jQuery} jQuery对象
{jQuery} ligerComboBox(p)
描述:
  • 1,可以将一个type=Select的表单对象转换成自定义下拉框。
  • 2,可以将一个type=text的表单对象转换成自定义下拉框(需要配置数据源)。
  • 3,可以将一个Dom容器(如div)对象转换成自定义下拉框(需要配置数据源)。
参数列表:
参数名 类型 描述 默认值
p {Object} 主要参数  
p.data {Array} 数据源.支持二维数组和JSON对象两种  
p.width {Int} 宽度  
p.height {Int} 高度  
p.resize {Bool} 是否调整大小 true
p.isMultiSelect {Bool} 是否多选 false
p.isShowCheckBox {Bool} 是否选择复选框 false
p.selectBoxWitch {Bool} 下拉框的宽度 false
p.selectBoxHeight {Bool} 下拉框的高度 false
p.textFieldID {String} text对应的字段名(需要数据源为JSON对象)  
p.valueFieldID {String} value对应的字段名(需要数据源为JSON对象)  
p.initValue {String} 初始化Value  
p.initText {String} 初始化Text  
p.split {String} 分割符号,多选时有效 ";"
p.columns {Array} 将下拉框转换为表格的模式 null
p.columns[i].name {String} 表格列名
p.columns[i].header {String} 表格列标题
p.columns[i].width {String} 表格列宽度
p.onBeforeSelect {Function} 选择前事件
  • 参数1：value
  • 参数2：text
 false
p.onSelected {Function} 选择后事件
  • 参数1：value
  • 参数2：text
 false
返回值:
{jQuery} jQuery对象
{jQuery} ligerDateEditor(p)
描述:
  • 可以将一个'文本框'的表单对象转换成可日期选择。
参数列表:
参数名 类型 描述 默认值
p {Object} 主要参数  
p.width {Int} 宽度  
p.format {String} Date格式化 "yyyy-MM-dd hh:mm"
p.showTime {Bool} 是否显示时间 false
p.onChangeDate {Function} 改变Date事件
  • 参数1：Date Value
 null
返回值:
{jQuery} jQuery对象
{jQuery} ligerDrag(p)
描述:
  • 使目标对象可以拖动。
参数列表:
参数名 类型 描述 默认值
p {Object} 主要参数  
p.handler {String|jQuery} 拖动的作用区域，在这个区域才可以触发拖动。可以是字符串(jQuery selector)，也可以是一个Dom jQuery对象 null
p.onStartDrag {Function} 开始拖动事件
  • 参数1：current(Object 包括 target,left,top,startX,startY)
  • 参数2：e
 null
p.onDragg {Function} 拖动事件(返回值为false时阻止继续拖动)
  • 参数1：current(Object 包括 target,left,top,startX,startY,diffX,diffY)
  • 参数2：e
 null
p.onStopDragg {Function} 结束拖动事件
  • 参数1：current(Object 包括 target,left,top,startX,startY,diffX,diffY)
  • 参数2：e
 null
返回值:
{jQuery} jQuery对象
{jQuery} ligerForm()
描述:
  • 应用自定义表单
例子:
    $("form").ligerForm();
返回值:
{jQuery} jQuery对象
{jQuery} ligerFrom()
描述:
  • 可以将一个表单转换成自定义表单。
返回值:
{jQuery} jQuery对象
{jQuery} ligerGrid(p)
描述:
  • 1,支持本地数据和服务器数据(配置data或者url)
  • 2,支持排序和分页(包括Javascript排序和分页)
  • 3,支持列的“显示/隐藏”
  • 4,支持明细行(表格内嵌)
  • 5,支持汇总行
  • 6,支持单元格模板
  • 7,支持编辑表格(ligerGrid的一个特色,需要其他表单插件的支持)
  • 8,支持树表格(待加入)
  • 8,支持分组(待加入)
参数列表:
参数名 类型 描述 默认值
p {Object} 主要参数
p.width {String|Int} 宽度值 'auto'
p.columnWidth {Int} 默认列宽度 120
p.resizable {String} table是否可伸缩 true
p.url {String} ajax url false
p.usePager {String} 是否分页 true
p.page {Int} 默认当前页 1
p.total {Int} 总页面数 1
p.pageSize {Int} 每页默认的结果数 10
p.pageSizeOptions {Array} 可选择设定的每页结果数 [10, 20, 30, 40, 50]
p.columns {Array} 数据源 []
p.columns[i].name {String} 表格列名  
p.columns[i].totalSummary {Object} 汇总  
p.columns[i].totalSummary.type {String} 汇总类型sum,max,min,avg  
p.columns[i].display {String} 表格列标题  
p.columns[i].headerRender {Function} 头部单元格渲染器
  • 参数1：column
p.columns[i].isAllowHide {Bool} 是否允许隐藏 false
p.columns[i].isSort {Bool} 是否允许排序 false
p.columns[i].type {String} 排序类型,包括string、int、float、date "string"
p.columns[i].width {Int} 表格列宽度  
p.columns[i].minWidth {Int} 表格列最小允许宽度(调整大小时将不允许小于这个值)  
p.columns[i].format {String} 格式化  
p.columns[i].align {String} 左右对齐,left、right、center  
p.columns[i].render {Function} 单元格渲染器
  • 参数1：记录项(对应数据源的某一条记录)
  • 参数2：当前行的索引
p.detail {Object} 明细  
p.detail.onShowDetail {Function} 明细函数
  • 参数1：row
  • 参数2：detailPanel
p.minColToggle {Int} 最小显示的列数目 1
p.dataAction {String} 提交数据的方式：本地(local)或(server),选择本地方式时将在客服端分页、排序 'server'
p.showTitle {Bool} 是否包含标题 false
p.showTableToggleBtn {Bool} 是否显示'显示隐藏Grid'按钮 false
p.allowAdjustColWidth {Bool} 是否允许调整列宽 true
p.showCheckbox {Bool} 是否显示复选框 true
p.showToggleColBtn {Bool} 是否显示'切换列层'按钮 true
p.enabledEdit {Bool} 是否允许编辑 false
p.isScroll {Bool} 是否滚动 true
p.dateFormat {String} 默认时间显示格式 'yyyy-MM-dd'
p.renderDate {Function} 获取时间默认函数,可重载 function (value)
{
var da;
if (!value) return null;
if (typeof value == 'object')
{
return value;
}
if (value.indexOf('Date') > -1)
{
da = eval('new ' + value.replace('/', '', 'g').replace('/', '', 'g'));
}
else
{
da = eval('new Date("' + value + '");');
}
return da;
}
p.onDragCol {Function} 拖动列事件 false
p.onToggleCol {Function} 切换列事件 false
p.onChangeSort {Function} 改变排序事件 false
p.onSuccess {Function} 成功事件 false
p.onSelectedRow {Function} 选择行事件 false
p.onAfterShowData {Function} 显示完数据事件
  • 参数1：Grid的Dom对象
 false
p.onError {Function} 错误事件 false
p.onSubmit {Function} 提交前事件 false
返回值:
{jQuery} jQuery对象
{jQuery} ligerLayout(p)
描述:
  • 应用Layout
参数列表:
参数名 类型 描述 默认值
p {Object} 主要参数  
p.leftWidth {Int} 左侧宽度  
返回值:
{jQuery} jQuery对象
{jQuery} ligerMessageBoxAlert(title, content, onBtnClick)
描述:
  • 显示提示弹出框
例子:
$.ligerMessageBox.alert({title:'标题',content:'内容']);
参数列表:
参数名 类型 描述 默认值
title {String} 标题  
content {String} 内容  
onBtnClick {Function} 点击确定事件
  • 参数1：button
  • 参数2：button index
  • 参数3：messageBox Dom object
返回值:
{jQuery} jQuery对象
{jQuery} ligerMessageBoxconfirm(title, content, callback)
描述:
  • 确定框
例子:
$.ligerMessageBox.confirm(title, content, function (r)
             {
                 alert(r ? '您点击了Y' : '您点击了N');
             });
参数列表:
参数名 类型 描述 默认值
title {String} 标题  
content {String} 内容  
callback {Function} 点击确定事件
  • 参数1：是否点击了确定
返回值:
{jQuery} jQuery对象
{jQuery} ligerMessageBoxError(title, content, onBtnClick)
描述:
  • 显示失败弹出框
例子:
$.ligerMessageBox.error({title:'标题',content:'内容']);
参数列表:
参数名 类型 描述 默认值
title {String} 标题  
content {String} 内容  
onBtnClick {Function} 点击确定事件
  • 参数1：button
  • 参数2：button index
  • 参数3：messageBox Dom object
返回值:
{jQuery} jQuery对象
{jQuery} ligerMessageBoxQuestion(title, content, onBtnClick)
描述:
  • 显示问题弹出框
例子:
$.ligerMessageBox.question({title:'标题',content:'内容']);
参数列表:
参数名 类型 描述 默认值
title {String} 标题  
content {String} 内容  
onBtnClick {Function} 点击确定事件
  • 参数1：button
  • 参数2：button index
  • 参数3：messageBox Dom object
返回值:
{jQuery} jQuery对象
{jQuery} ligerMessageBoxShow(p)
描述:
  • 显示弹出框
例子:
             $.ligerMessageBox.show(
             {
                 width: 270,
                 type: type,
                 title:title,
                 content: '窗口改变大小事件',
                 buttons: [{ text: '确定', onclick: btnClick }, { text: '取消', onclick: btnClick}]
             });
参数列表:
参数名 类型 描述 默认值
p {Object} 主要参数  
p.type {String} 类型，包括success、donne、error、warn、question ""
p.width {Int} 宽度  
p.title {String} 标题   
p.content {String} 内容   
p.buttons {Array} 按钮   
p.buttons[i].width {Int} 宽度   
p.buttons[i].text {String} 文本   
p.buttons[i].onclick {Function} 显示完数据事件
  • 参数1：button
  • 参数2：button index
  • 参数2：messageBox Dom object
返回值:
{jQuery} jQuery对象
{jQuery} ligerMessageBoxSuccess(title, content, onBtnClick)
描述:
  • 显示成功弹出框
例子:
$.ligerMessageBox.success({title:'标题',content:'内容']);
参数列表:
参数名 类型 描述 默认值
title {String} 标题   
content {String} 内容  
onBtnClick {Function} 点击确定事件
  • 参数1：button
  • 参数2：button index
  • 参数3：messageBox Dom object
返回值:
{jQuery} jQuery对象
{jQuery} ligerMessageBoxWarn(title, content, onBtnClick)
描述:
  • 显示警告弹出框
例子:
$.ligerMessageBox.warn({title:'标题',content:'内容']);
参数列表:
参数名 类型 描述 默认值
title {String} 标题  
content {String} 内容  
onBtnClick {Function} 点击确定事件
  • 参数1：button
  • 参数2：button index
  • 参数3：messageBox Dom object
返回值:
{jQuery} jQuery对象
{jQuery} ligerRadio()
描述:
  • 可以将一个单选框的表单对象转换成自定义单选框。
返回值:
{jQuery} jQuery对象
{jQuery} ligerResizable(p)
描述:
  • 使目标对象可以调整大小。
例子:
$("#exam1").ligerResizable();
参数列表:
参数名 类型 描述 默认值
p {Object} 主要参数  
p.handles {String} 调整大小的作用区域，在这个区域才可以触发调整大小。字符串。包括n , e, s, w, ne, se, sw, nw这八个方向，可自由选择一个或多个，多个时用逗号隔开(jQuery selector)，也可以是一个Dom jQuery对象 "n, e, s, w, ne, se, sw, nw"
p.maxWidth {Int} 最大宽度 2000
p.maxHeight {Int} 最大高度 2000
p.minWidth {Int} 最小宽度 20
p.minHeight {Int} 最小高度 20
p.onStartResize {Function} 开始调整大小事件
  • 参数1：current(Object 包括 dir,left,top,width,height)
  • 参数2：e
 null
p.onResize {Function} 调整大小事件
  • 参数1：current(Object 包括 dir,left,top,width,height,newWidth,newHeight,diffTop,diffLeft)
  • 参数2：e
 null
p.onStopResize {Function} 结束调整大小事件
  • 参数1：current(Object 包括 dir,left,top,width,height,newWidth,newHeight,diffTop,diffLeft)
  • 参数2：e
 null
返回值:
{jQuery} jQuery对象
{jQuery} ligerSpinner(p)
描述:
  • 可以将一个'文本框'的表单对象转换成可调整
参数列表:
参数名 类型 描述 默认值
p {Object} 主要参数  
p.type {Int} 类型 float:浮点数 int:整数 time:时间  
p.decimalplace {Int} 小数位 type=float时起作用 2
p.isNegative {Bool} 是否是否负数 false
p.onChangeValue {Function} 改变值事件
  • 参数1：value
 null
返回值:
{jQuery} jQuery对象
{jQuery} ligerTab()
描述:
  • 应用Tab
返回值:
{jQuery} jQuery对象
{jQuery} ligerWindowShow(p)
描述:
  • 弹出窗口。
例子:
$.ligerWindow.show(
             {
                 url:'welcome.html'
             });
参数列表:
参数名 类型 描述 默认值
p {Object} 主要参数  
p.url {String} url  
p.name {String} frame name  
p.left {String} left  
p.right {String} right  
p.top {String} top   
p.bottom {String} bottom  
p.width {Int} 宽度  
p.height {Int} 高度  
p.title {String} 标题   
返回值:
{jQuery} jQuery对象
API for jQuery LigerUI 1.0(Documentation generated by JsDoc Toolkit)
 posted on 2011-04-07 21:28  谢略  阅读(19003)  评论(4)  编辑  收藏  举报