坚持

<!DOCTYPE html>
<html>
<head>
    <title>ExtJs</title>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <link rel="stylesheet" type="text/css" href="ExtJs/packages/ext-theme-crisp/build/resources/ext-theme-crisp-all.css">
        <script type="text/javascript" src="ExtJs/ext-all.js"></script>
        <script type="text/javascript" src="ExtJs/bootstrap.js"></script>
        <script type="text/javascript" src="ExtJs/packages/ext-theme-crisp/build/ext-theme-crisp.js"></script>

    <script type="text/javascript">
            Ext.onReady(function(){
                new Ext.form.Panel({
                    title: 'Ext.form.field.Checkbox and Radio Sample',
                    bodyStyle: 'padding: 5 5 5 5',
                    frame: true,
                    height: 150,
                    width: 250,
                    renderTo: 'form',
                    defaults: {
                        labelSeparator: ':',
                        labelWidth: 80,
                        width: 200,
                        labelAlign: 'left'
                    },
                    items: [{
                        xtype: 'radio',
                        name: 'sex',
                        fieldLabel: 'sex',
                        boxLabel: 'male'
                    },{
                        xtype: 'radio',
                        name: 'sex',
                        fieldLabel: 'sex',
                        boxLabel: 'femail'
                    },{
                        xtype: 'checkboxfield',
                        name: 'swim',
                        fieldLabel: 'hobby',
                        boxLabel: 'swim'
                    },{
                        xtype: 'checkboxfield',
                        name: 'walk',
                        fieldLabel: 'hobby',
                        boxLabel: 'walk'
                    }]
                });

                new Ext.form.Panel({
                    title: 'Ext.form.field.Checkbox and Radio Sample',
                    bodyStyle: 'padding: 5 5 5 5',
                    frame: true,
                    height: 200,
                    width: 270,
                    renderTo: 'form1',
                    defaults: {
                        labelSeparator: ':',
                        labelWidth: 50,
                        width: 200,
                        labelAlign: 'left'
                    },
                    items: [{
                        xtype: 'radiogroup',
                        fieldLabel: 'sex',
                        columns: 2,
                        items: [
                            {boxLabel: 'male', name: 'sex', inputValue: 'male'},
                            {boxLabel: 'female', name: 'sex', inputValue: 'female'}
                        ]
                    },{
                        xtype: 'checkboxgroup',
                        fieldLabel: 'hobby',
                        columns: 3,
                        items: [
                            {boxLabel: 'swim', name: 'swim'},
                            {boxLabel: 'walk', name: 'walk'},
                            {boxLabel: 'read', name: 'read'},
                            {boxLabel: 'game', name: 'game'},
                            {boxLabel: 'movie', name: 'movie'}
                        ]
                    }]
                });
            });
    </script>
</head>
<body>
    <div id='form'></div>
        <div id='form1'></div>

</body>
</html>

ExtJs之单选及多选框的更多相关文章

  1. 使用 SVG 制作单选和多选框动画【附源码】

    通过 JavaScript 实现 SVG 路径动画,我们可以做很多花哨的东西.今天我们要为您介绍一些复选框和单选按钮效果.实现的主要思路是隐藏原生的输入框,使用伪元素创造更具吸引力的样式,输入框被选中 ...

  2. php一些单选、复选框的默认选择方法（示例）

    转载 http://www.php.cn/php-weizijiaocheng-360029.html 一. radio和checkbox及php select默认选择的实现代码 1.radio单选框 ...

  3. Python3+Selenium3+webdriver学习笔记8（单选、复选框、弹窗处理）

    #!/usr/bin/env python# -*- coding:utf-8 -*-'''Selenium3+webdriver学习笔记8(单选.复选框.弹窗处理)''' from selenium ...

  4. iCheck获取单选和复选框的值和文本

    //获取单选和复选框的值//parameters.type:"radio","checkbox"//parameters.name:input-name//pa ...

  5. MFC_2.1使用单选和多选框

    使用单选和多选框 单选 1.拖控件 设置名字,CTRL+D设置顺序,属性设置第一个GROUP为TRUE: 2.设置第一个按钮绑定变量为 值 INT型 名称m_RadioIndxe; 3.设置单击响应内 ...

  6. ExtJs 4.2.1 复选框数据项动态加载(更新一下)

    最近在做博客项目,后台管理用的是ExtJs4.2.1版本,因为是初学所以在使用的时候也遇到不少的这样或那样的问题,也写了不少这方面的博客,今天要写的博客是关于复选框数据项动态的加载功能,以前也没用过, ...

  7. 纯css美化单选、复选框

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

  8. mui单选和多选框

    具体见代码: <!doctype html> <html> <head> <meta charset="UTF-8"> <ti ...

  9. selenium+Python（定位 单选、复选框，多层定位）

    1.定位一组元素webdriver 可以很方便的使用 findElement 方法来定位某个特定的对象,不过有时候我们却需要定位一组对象,这时候就需要使用 findElements 方法.定位一组对象 ...

随机推荐

  1. perl连接mysql（转载）

    文章来源:http://blog.sina.com.cn/s/blog_9d0445d50101czsr.html 首先需要用ppm安装DBI和DBD-mysql ,如果没有的话点击EDIT-pref ...

  2. 29.DDR2问题1仿真模型文件

    在使用modelsim仿真DDR2时,一般我们会用美光网站上下载的DDR2仿真模型.仿真模型文件一般有ddr2_module.v,ddr2.v,ddr2_mcp.v,ddr2_parameters.v ...

  3. Java实现Socket之TimeClient

    Java实现Socket之TimeClient 代码内容 从time.nist.gov服务器的37号端口得到时间信息,并对时间进行解析后显示出来 代码实现 /* TimeClient.java */ ...

  4. android selector

    android 选择器的使用 1.在drawable文件夹下面建一个xml文件,如item.xml,在eclipse中有selector这个选项 2.可以在布局文件.xml(配置android:lis ...

  5. zabbix语言设置

    1.怎样支持中文: https://www.zabbix.org/wiki/How_to/install_locale 官方解决方法 实际操作中,进入/var/lib/locales/supporte ...

  6. C#加密解密算法汇总（转）

    方法一:     //须添加对System.Web的引用     using System.Web.Security;           ...           /// <summary& ...

  7. android应用程序的安装方式与原理

    android应用程序的安装方式与原理 四种安装方式: 1.系统应用安装――开机时完成,没有安装界面 2.网络下载应用安装――通过market应用完成,没有安装界面 3.ADB工具安装――没有安装界面 ...

  8. Python编码设置

    系统编码顺序: 1, a.encode(sys.stdout.encoding) 2, a.encode(default_string) sys.stdout.encoding里的值可以用环境变量PY ...

  9. 我对GIT的理解

    git是一个版本或项目代码管理工具.能够方便的管理多个开发人员共同协助开发的代码.在git的管理下,每个开发人员都能同时对项目进行开发,开发人员被划分成不同的分支,每个开发人员都能拥有自己的一个或者多 ...

  10. Spring与apache CXF结合实例

    本文的前提是已经有一个Spring的项目,在此基础上如何跟apache CXF进行结合,开发出WebService服务和调用WebService服务. 1.开发WebService   1.引入jar ...