zoukankan      html  css  js  c++  java
  • 单选框和复选框组

        //Ext.form.CheckboxGroup和Ext.form.RadioGroup
            /// <reference path="Extjs/ext-all-dev.js" /> 
            Ext.get(document.body).update("<div></div>")
            var f_Pannel = Ext.create('Ext.form.Panel', {
                renderTo: Ext.getBody(),
                frame: true,
                250,
                height: 150,
                defaults: {
                    labelSepator: ':',
                    labelWidth: 28,
                    labelAlign: 'left',//面板中有两个元素:label表单字段标签和表单字段,这里就是表单面板对象,所以可以在这里定义label位置
                    200,//定义表单字段的大小,这里是radiogroup和checkboxgroup的宽度。
                    //boxLabelAlign: 'before'//单选or复选框内容标签的位置,默认为after。还可设定为before。应该放到radio和checkbox对象中
                    //才会其作用
                },
                items: [


                    {
                        xtype: 'radiogroup', fieldLabel: '性别', columns: 2,//radio和checkbox仍然数序Ext。form。field的范畴,所以可以
                        items: [                                //这里仍然是filedLabel定义标签内容。columns定义单选框的列数。
                          { boxLabel: '男', name: 'sex' },//boxLabel用以定义radio和checkbox的框内容,name用以定义组件是标识,在
                          { boxLabel: '女', name: 'sex' }//向后台传输数据时是其标识,即是其身份证。在radio使用name,name要定义为相同值
                        ]                              //这样才能实现radio只能选择一个的功能


                    },
            {
                xtype: 'checkboxgroup', fieldLabel: '爱好', columns: 3,//columns可能影响到boxLabel的显示问题,其显示可能不能在一行完成
                items: [                          //labelBox值可能会在两行显示~很不美观。columns和width同时影响着boxLabel的显示问题。
                  { boxLabel: '唱歌', name: 's' },
                  { boxLabel: '远足', name: 'h' },
                { boxLabel: '钓鱼', name: 'f' },
                { boxLabel: 'read', name: 'r' },
                { boxLabel: 'mov', name: 'm' }
                ]
            }
                ]
            });


            //Ext。form。CheckGroup和Ext。form。RadioBox
  • 相关阅读:
    读本地json的方法
    告诉你如何应对HR索要薪资证明!
    函数声明与函数表达式
    原型的动态性
    工作实际需求andjs进阶图书
    表单元素操作,button,点击下载按钮实现-长知识
    grunt注意要点
    重新认识块级元素--DIV
    GO语言学习:变量间赋值
    GO语言学习:单通道
  • 原文地址:https://www.cnblogs.com/lz3018/p/4579794.html
Copyright © 2011-2022 走看看