zoukankan      html  css  js  c++  java
  • jQuery LigerUI API预览版发布

     

    插件方法列表
    • 应用面板
    • 可以将一个复选框的表单对象转换成自定义复选框。
    • 1,可以将一个type=Select的表单对象转换成自定义下拉框。
    • 2,可以将一个type=text的表单对象转换成自定义下拉框(需要配置数据源)。
    • 3,可以将一个Dom容器(如div)对象转换成自定义下拉框(需要配置数据源)。
    • 可以将一个'文本框'的表单对象转换成可日期选择。
    • 使目标对象可以拖动。
    • 应用自定义表单
    • 可以将一个表单转换成自定义表单。
    • 1,支持本地数据和服务器数据(配置data或者url)
    • 2,支持排序和分页(包括Javascript排序和分页)
    • 3,支持列的“显示/隐藏”
    • 4,支持明细行(表格内嵌)
    • 5,支持汇总行
    • 6,支持单元格模板
    • 7,支持编辑表格(ligerGrid的一个特色,需要其他表单插件的支持)
    • 8,支持树表格(待加入)
    • 8,支持分组(待加入)
    • 应用Layout
    ligerMessageBoxAlert(title, content, onBtnClick)
    • 显示提示弹出框
    ligerMessageBoxconfirm(title, content, callback)
    • 确定框
    ligerMessageBoxError(title, content, onBtnClick)
    • 显示失败弹出框
    ligerMessageBoxQuestion(title, content, onBtnClick)
    • 显示问题弹出框
    • 显示弹出框
    ligerMessageBoxSuccess(title, content, onBtnClick)
    • 显示成功弹出框
    ligerMessageBoxWarn(title, content, onBtnClick)
    • 显示警告弹出框
    • 可以将一个单选框的表单对象转换成自定义单选框。
    • 使目标对象可以调整大小。
    • 可以将一个'文本框'的表单对象转换成可调整
    • 应用Tab
    • 弹出窗口。
    插件方法详细
    {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(
                 {
                      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)
  • 相关阅读:
    Hadoop Ambari 安装
    hadoop 集群配置--增加减少新的机器不重启
    使用 XMPP 构建一个基于 web 的通知工具——转
    Hadoop 1.1.2 Eclipse 插件使用——异常解决
    UltraEdit中文乱码的解决方法
    Hadoop开发环境简介(转)
    Hadoop构成
    hadoop 1.2.1 eclipse 插件编译
    Python print 输出到控制台 丢数据
    社招面试总结
  • 原文地址:https://www.cnblogs.com/leoxie2011/p/2008717.html
Copyright © 2011-2022 走看看