webix Tab页面装换

webix.ui({
 view:"form", elements:[
 {
 view:"tabview",
 tabbar:{ options:["A","B","C"]}, animate:false,
 cells:[
 { id:"A", rows:[
 { view:"text", name:"value1", label:"value1" },
 {}
 ]},
 { id:"B", rows:[
 { view:"text", name:"value2", label:"value2" },
 {}
 ]},
 { id:"C", rows:[
 { view:"text", name:"value3", label:"value3" },
 {}
 ]}
 ]
 },
 { cols:[
 {},
 { view:"button", value:"Get value", click:function(){
 webix.message("<pre>"+JSON.stringify($$("$form1").getValues(), 0, 1)+"</pre>");    //在右上角输出弹窗
 }},
 { view:"button", value:"Validate", click:function(){
 //'true' forces validation of hidden fields
 $$("$form1").validate({hidden:true});    //校验数据是否正确
 }},
 {}
 ]},
 ],
 rules:{    //校验规则
 "value1":webix.rules.isNotEmpty,
 "value2":webix.rules.isNumber,
 "value3":webix.rules.isNotEmpty
 },
 on:{
 onAfterValidation:function(result, value){   //通过校验结果执行事件
 if (!result)
 webix.message({type:"error", text:"Incorrect values"});
 else
 webix.message("Data is correct");
 }
 }
 });
  
 $$("$form1").setValues({
 value1:"111",
 value3:"333",
 });


教程原址:https://docs.webix.com/desktop__form.html

例子原址:https://docs.webix.com/samples/13_form/02_api/13_tabs_form.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值