坚持

<!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. SQL中的内连接外连接和交叉连接是什么意思?

    内连接又分为等值连接.自然连接和不等连接三种. 外连接分为左外连接(LEFT OUTER JOIN或LEFT JOIN).右外连接(RIGHT OUTER JOIN或RIGHT JOIN)和全外连接( ...

  2. ListView与GridView异步加载图片

    原理很简单,主要是用到了回调方法,下面是异步加载图片的类 <span style="font-size:16px;">package com.xxx.xxx; impo ...

  3. meteor 安装 android sdk慢的改进方法

    网上方法很多,最后总结一下比较靠谱的一个,到~/.meteor/android_bundle/ 目录下, 执行tools/android,手动下载 API 19 和 intel X86 Atom Sy ...

  4. [笔记]学习HighCharts的使用（不错的web图表插件）

    最近有一个小项目需要用到折线图.到处请教了一下,有人给我推荐了highcharts.感觉还不错,就稍微学习下.这里记录一下学习的过程. 网上相关的内容还不少,我就说一下我学习的内容. 看的第一篇文章& ...

  5. HTML a 标签 下载 apk 文件

    代码:   <a href="http://www.abc2016.com/phone_Client/shouji.apk" class="download_inp ...

  6. 7.FPGA中的同步复位与异步复位

    1.异步复位 always @ ( posedge sclk or negedge s_rst_n ) if ( !s_rst_n ) d_out <= 1'b0; else d_out < ...

  7. maven属性

    Maven内置了三大特性:属性.Profile和资源过滤来支持构建的灵活性. 内置属性:主要有两个常用内置属性 ${basedir}表示项目根目录,即包含pom.xml文件的目录 ${version} ...

  8. 11.3Daily Scrum

    人员 任务分配完成情况 明天任务分配 王皓南 实现网页上视频上传的功能,研究相关的代码782 数据库测试 申开亮 实现网页上视频浏览的功能.研究相关的代码和功能.783 实现视频浏览的功能 王宇杰 负 ...

  9. SVG基本图形及clipPath;

    利用SVG可以实现很多复杂的图形,SVG的功能开发者们已经开发许多,今天初识一下SVG的基本图形绘制, <svg viewbox="0,0,400,400" style=&q ...

  10. 【Exception】 java.lang.NoSuchMethodError: android.app.AlertDialog$Builder.setOnDismissListener

    f(Build.VERSION.SDK_INT >10) builder =newAlertDialog.Builder(getActivity(), R.style.Theme.Sherloc ...