Form - jQuery LigerUI API

jQuery LigerUI

previous page next page

参数列表

参数名 类型 描述 默认值
inputWidth Int 控件宽度 180
labelWidth Int 标签宽度 90
space Int 间隔宽度 40
rightToken String rightToken '：'
labelAlign String 标签对齐方式 'left'
align String 控件对齐方式 'left'
fields Array 字段 []
appendID String 创建的表单元素是否附加ID  
prefixID String   null
toJSON Function json解析函数 $.ligerui.toJSON
editorBulider      
labelCss String label Css ClassName null
fieldCss String field Css ClassName null
spaceCss String space Css ClassName null
buttons Array 按钮组 null
readonly Bool 是否只读 false
editors Object 编辑器集合,使用同$.ligerDefaults.Grid.editors {}
validate Object 验证设置 null
unSetValidateAttr Bool 不设置validate null
width Int 宽度 0
tab Object 页签 0

Fields

参数名 类型 描述 默认值
name String 字段name null
textField String 文本框name null
type String 元素类型 null
edtior Object 编辑器扩展参数 null
label String 标签 null
labelInAfter Bool label是否后置 false
afterContent String 后置内容 null
beforeContent String 前置内容 null
hideSpace Bool 隐藏空隙部分 false
hideLabel Bool 隐藏标签部分 false
rightToken String 标签后内容  
attrRender Function 自定义字段html属性  
style String 自定义字段css  
containerCls String 自定义字段css类名  
newline Bool 是否换行显示  
validate Object 验证支持  

fields参数 示例：

 1 //创建表单结构 
 2             $("form").ligerForm({
 3                 inputWidth: 170, labelWidth: 90, space: 40,
 4                 fields: [
 5                 { name: "ProductID", type: "hidden" },
 6                 { display: "产品名称", name: "ProductName", newline: true, type: "text" , group: "基础信息", groupicon: groupicon}, 
 7                 { display: "供应商", name: "SupplierID", newline: false, type: "select", comboboxName: "CompanyName", options: { valueFieldID: "SupplierID" } },
 8                 { display: "类别 ", name: "CategoryID", newline: true, type: "select", comboboxName: "CategoryName", options: { valueFieldID: "CategoryID" }, width: 240 },
 9                 { display: "日期 ", name: "AddTime", newline: true, type: "date"  },
10                 { display: "折扣", name: "QuantityPerUnit", newline: false, type: "number" },
11                 { display: "单价", name: "UnitPrice", newline: true,  type: "number" },
12                 { display: "库存量", name: "UnitsInStock", newline: true, type: "digits", group: "库存", groupicon: groupicon },
13                 { display: "订购量", name: "UnitsOnOrder", newline: false, type: "digits" },
14                 { display: "备注", name: "Remark", newline: true, type: "text" ,width:470 }
15                 ]
16             });

tab参数 示例：

form = $("#form2").ligerForm({
                inputWidth: 170, labelWidth: 90, space: 40,
                validate : true,
                fields: [
                { name: "ProductID", type: "hidden" }, 
                { display: "日期 ", name: "AddTime", newline: true, type: "date" ,validate:{required:true } },
                { display: "折扣", name: "QuantityPerUnit", newline: true, type: "number",validate:{required:true } },
                { display: "单价", name: "UnitPrice", newline: true,  type: "number",validate:{required:true } } 
                ],
                tab: {
                    items : [
                        {
                            title: '第一个页签', fields: [
                                   { display: "库存量", name: "UnitsInStock", newline: true, type: "digits"  },
                                    { display: "订购量", name: "UnitsOnOrder", newline: false, type: "digits" }
                            ]
                        },
                        {
                            title: '第二个页签(备注)(隐藏label)', fields: [
                                    { display: "备注", name: "Remark", newline: true, type: "textarea", width: 470, validate: {   }, hideLabel: true }
                            ]
                        }
                    ]
                }
            });

previous page start next page