Ext.form.field.CheckBox復選框和Ext.form.field.Radio單選框

本文轉載自查看原文 2012-04-21 02:58 18806

1、Ext.form.field.CheckBox和Ext.form.field.Radio主要配置項目

配置項	類型	說明
boxLabel	String	緊靠復選框的文字描述
boxLabelAlign	String	設置復選框關聯標簽的位置，有效值包括：“before”和“after”，默認為“after”
checked	Boolean	設置復選框默認是否被選中，默認為false
handler	Function	設置當選中狀態發生變化時的處理函數，傳入參數為： checkbox：Ext.form.Checkbox復選框組件 checked:Boolean新的選中狀態
inputValue	String	提交值，默認為“on”
scope	Object	設置handler處理函數的作用范圍
uncheckedValue	String	設置當復選框未選中時向后台提交的值，默認為undefined

2、Ext.form.field.CheckBox和Ext.form.field.Radio示例

代碼：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Ext.form.field.CheckBox和Ext.form.field.Radio示例</title>
    <link href="ext-4.0.7-gpl/resources/css/ext-all.css" rel="stylesheet" type="text/css" />
    <script src="ext-4.0.7-gpl/bootstrap.js" type="text/javascript"></script>
    <script type="text/javascript">
        Ext.onReady(function () {
            new Ext.form.Panel({
                title: "Ext.form.field.CheckBox和Ext.form.field.Radio示例",
                bodyStyle: "padding:5",
                frame: true,
                height: 150,
                width: 300,
                renderTo: Ext.getBody(),
                defaults: {
                    labelSeparator: "：",
                    labelWidth: 80,
                    width: 200,
                    labelAlign: "left"
                },
                items: [{
                    xtype:"radio",
                    name:"sex",
                    fieldLabel:"性別",
                    boxLabel:"男"
                }, {
                    xtype: "radio",
                    name: "sex",
                    fieldLabel: "性別",
                    boxLabel: "女"
                }, {
                    xtype: "checkboxfield",
                    name: "swim",
                    fieldLabel: "愛好",
                    boxLabel: "游泳"
                }, {
                    xtype: "checkboxfield",
                    name: "walk",
                    fieldLabel: "愛好",
                    boxLabel: "散步"
                }]
            });
        });
    </script>
</head>
<body>
</body>
</html>

效果圖：

免責聲明！

本站轉載的文章為個人學習借鑒使用，本站對版權不負任何法律責任。如果侵犯了您的隱私權益，請聯系本站郵箱yoyou2525@163.com刪除。

猜您在找 JS中獲取頁面單選框radio和復選框checkbox中當前選中的值 html 復選框(checkbox)和單選框(radio)與文字水平垂直居中對齊 JS中獲取頁面單選框radio和復選框checkbox中當前選中的值成組的單選框radio、成組的復選框checkbox以及區別自動化測試基礎篇--Selenium單選框（Radio）復選框（CheckBox） JS中獲取頁面單選框radio和復選框checkbox中當前選中的值用jquery修改默認的單選框radio或者復選框checkbox選擇框樣式純CSS3來自定義單選框radio與復選框checkbox 微信小程序：單選框radio和復選框CheckBox 單選框和復選框（radiobox、checkbox）