ExtJs之单选及多选框
坚持
<!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之单选及多选框的更多相关文章
- 使用 SVG 制作单选和多选框动画【附源码】
通过 JavaScript 实现 SVG 路径动画,我们可以做很多花哨的东西.今天我们要为您介绍一些复选框和单选按钮效果.实现的主要思路是隐藏原生的输入框,使用伪元素创造更具吸引力的样式,输入框被选中 ...
- php一些单选、复选框的默认选择方法(示例)
转载 http://www.php.cn/php-weizijiaocheng-360029.html 一. radio和checkbox及php select默认选择的实现代码 1.radio单选框 ...
- Python3+Selenium3+webdriver学习笔记8(单选、复选框、弹窗处理)
#!/usr/bin/env python# -*- coding:utf-8 -*-'''Selenium3+webdriver学习笔记8(单选.复选框.弹窗处理)''' from selenium ...
- iCheck获取单选和复选框的值和文本
//获取单选和复选框的值//parameters.type:"radio","checkbox"//parameters.name:input-name//pa ...
- MFC_2.1使用单选和多选框
使用单选和多选框 单选 1.拖控件 设置名字,CTRL+D设置顺序,属性设置第一个GROUP为TRUE: 2.设置第一个按钮绑定变量为 值 INT型 名称m_RadioIndxe; 3.设置单击响应内 ...
- ExtJs 4.2.1 复选框数据项动态加载(更新一下)
最近在做博客项目,后台管理用的是ExtJs4.2.1版本,因为是初学所以在使用的时候也遇到不少的这样或那样的问题,也写了不少这方面的博客,今天要写的博客是关于复选框数据项动态的加载功能,以前也没用过, ...
- 纯css美化单选、复选框
<!doctype html> <html> <head> <meta charset="utf-8"> <title> ...
- mui单选和多选框
具体见代码: <!doctype html> <html> <head> <meta charset="UTF-8"> <ti ...
- selenium+Python(定位 单选、复选框,多层定位)
1.定位一组元素webdriver 可以很方便的使用 findElement 方法来定位某个特定的对象,不过有时候我们却需要定位一组对象,这时候就需要使用 findElements 方法.定位一组对象 ...
随机推荐
- Android之完美退出方法
为什么要写这篇文章? 网上有很多种退出方法,可实际上很多方法都不通用(在某个版本下可用,到了另一个版本就不行),或者方法的实际效果根本就和其描述不符(也不知道那些发帖的人测没测试过). 但我们的需求又 ...
- Spring原来属于这家公司
Spring几年前被VMware公司收购,如今Spring版权隶属于Pivotal.Pivotal ONE对Spring提供整合.Greenplum提供了大数据服务,GEMFIRE内存集群技术帮助12 ...
- centos下安装nagios
摘要Nagios是一款开源的免费网络监视工具,能有效监控Windows.Linux和Unix的主机状态,交换机路由器等网络设置,打印机等. Nagios是一款开源的免费网络监视工具,能有效监控Wind ...
- [ios]ios-Demo4脱衣服/刮奖app-专业
普通版本完成的锯齿很严重 但是Ios系统中仅CGContextClearRect 并不存在cyclo等方法. 网上查了一些资料. 发现还是利用到了CG 中的Mask来实现效果图: 这种效果可以自定义画 ...
- 深入浅出TCP/IP簇
TCP/IP是“transmission Control Protocol/Internet Protocol”的简写,中文译名为传输控制协议/互联网络协议.TCP/IP不是一个协议,而是一个协议簇的 ...
- Java 集合转换(数组、List、Set、Map相互转换)
转自:http://blog.csdn.net/top_code/article/details/10552827 package com.example.test; import java.util ...
- VDN For PB Web实现消息推送
利用VesnData.Net(VDN)的互联网数据驱动功能我们实现了PB连接互联网数据库的功能.在互联网开发的过程中我们往往有些消息或者数据希望即时能够通知到各个客户端,现在比较流行的一种技术就是消息 ...
- java 图片处理
/* * 图片处理类 */ package image; import com.sun.image.codec.jpeg.JPEGCodec; import com.sun.image.codec.j ...
- 团队项目(NABC分析)
我们团队开发的是<校园导航>软件 (1)N(Need需求) 我们的团队主要考虑到我们学校没有自己的校园导航,有时会给同学及参观人员带来不便,又看到好多学校都有自己的导航,所以就从这个需求方 ...
- 受限玻尔兹曼机RBM—简易详解