最新发版v1.0.2中的buildItems组件已支持一行多个元素

发布：2023-08-07 11:42分类：后端程序评论：2浏览：204

最新发版v1.0.2中的buildItems组件可通过属性itemCol来实现设置单行多个表单元素显示，示例代码如下：

``` 
admin.open({
    type: 1,
    bid: 'form_items',
    btn: ['确定', '取消'],
    area: ['720px', '700px'],
    title: '弹窗标题',
    success: function(l,index){
        layui.buildItems.build({
            bid: 'form_items',
            data: [
                {name:"names",title:"姓名",type:"text",value:'',placeholder:"请输姓名",verify:'required',must:true,itemCol:'layui-col-md6'},
                {name:"old",title:"年龄",type:"text",value:'',placeholder:"请输年龄",verify:'required',must:true,itemCol:'layui-col-md6'},
                {name:"place",title:"籍贯",type:"text",value:'',placeholder:"请输籍贯",verify:'required',must:true,itemCol:'layui-col-md4'},
                {name:"gender",title:"性别",type:"radio",value:'1',options:{1:'男',2:'女',3:'保密'},must:true,itemCol:'layui-col-md8'},
                {name:"txt1",title:"左标题",type:"text",value:'',placeholder:"请输左标题",verify:'required',must:true,itemCol:'layui-col-md4'},
                {name:"txt2",title:"中标题",type:"text",value:'',placeholder:"请输中标题",verify:'required',must:true,itemCol:'layui-col-md4'},
                {name:"txt3",title:"右标题",type:"text",value:'',placeholder:"请输右标题",verify:'required',must:true,itemCol:'layui-col-md4'},
            ]
        });
        form.on('submit(form_items)',function(data){
            //提交处理业务逻辑
            return false;
        });
    }
});
```

实现效果：

![tancxg.jpg#S](/file/upload/image/u5/20230807/64d067f99da0c.jpg)

单行多个元素 buildItems

cnfox02731 楼
2023-12-07 06:49

very cool

0 回复 (0)
root2 楼
2024-03-28 15:40

学习了

0 回复 (0)

发布帖子

作者信息

: haohao; 等级：Lv2; 积分：3343; 这家伙很懒，什么都没写呢~

最新发版v1.0.2中的buildItems组件已支持一行多个元素

发布：2023-08-07 11:42分类：后端程序评论：2浏览：204

作者信息

最近热帖