dojo小例子（9）动态创建带label的CheckBox集合

比眉伴天荒 2022-08-25 11:58 208阅读 0赞

/**
     * 循环创建带label的CheckBox集合
     */
    require(["dijit/form/CheckBox","dojo/dom-construct","dojo/domReady!"], function(CheckBox,domConstruct){
    	// 创建数据
    	var data_list = [
    	                 { col1: "normal", col2: false, col4: 29.91},
    	                 { col1: "important", col2: false, col4: 9.33},
    	                 { col1: "very", col2: false, col4: 19.34}
    	               ];
        for( i = 0; i < data_list.length; i++ )
        {
            var item = data_list[i];
            // CheckBox
            var boxOne = new CheckBox({
    	        name: "types"
    	    });
    	    // 放到指定html标签
    		boxOne.placeAt('childDocLib');
    		// 根据数据的值设置CheckBox title、value属性
    		boxOne.set('title',item.col4);
    		boxOne.set('value',item.col4+''); // 不加''会取不到值
    		
    		if( i == 2 )
            {
    	        // 选中
    			boxOne.set('checked',true);
            }else
            {
            	boxOne.set('checked',false);
            }
            // 因为checkbox自带label不起作用，又想在checkbox后显示文字，所以通过这种方法添加label标签实现
    		childDocLib.appendChild(domConstruct.create("label", {innerHTML: item.col4}));
        }
    });

<table>
    			<tr>
    				<td id="childDocLib"></td>
    			</tr>
    		</table>

发表评论取消回复

表情：

评论列表（有 0 条评论，208人围观）

还没有评论，来说两句吧...

相关阅读

相关 dojo小例子（13）给Select指定id及label

用store为Select提供数据时，store中的数据必须带有id和label属性。实际情况是我们的数据格式多种多样，不一定带有id和label。这时可以用Select的la

男娘i/ 2022年08月27日 01:26/ 0 赞/ 135 阅读

相关 dojo小例子（12）form转换成带内部对象的json数据

假设有这样一个form <div id="myform" data-dojo-type="dijit/form/Form"> <div>姓名<input n

我不是女神ヾ/ 2022年08月27日 01:25/ 0 赞/ 148 阅读

相关 dojo小例子（11）grid编辑提交

选中grid某一行编辑，打开一个form表单显示这条记录进行编辑，完成后，表单提交时调用此方法把数据存入后台 function submit(){

痛定思痛。/ 2022年08月25日 12:50/ 0 赞/ 196 阅读

相关 dojo小例子（9）动态创建带label的CheckBox集合

/ 循环创建带label的CheckBox集合 / require(["dijit/form/CheckBox","dojo/dom-co

比眉伴天荒/ 2022年08月25日 11:58/ 0 赞/ 209 阅读

相关 dojo小例子（4）DataGrid对动态数据的增删

<script> require(['dojo/_base/array', 'dojo/_base/event', 'dojo/on', 'dojox/gri

本是古典何须时尚/ 2022年08月25日 09:29/ 0 赞/ 178 阅读

相关 dojo小例子（20）动态加载的Select增加一个option空白项

有时我们希望下拉菜单带有提示项，比如默认第一项是“--请选择--”；或者“--全部--”表示包含下拉菜单中的所有条件。有两种实现方式： 1、修改store，在其中添加数据

迷南。/ 2022年08月24日 11:40/ 0 赞/ 236 阅读

相关 dojo小例子（35）带校验功能SimpleTextarea

// 带校验功能的SimpleTextarea /// define(["dojo/_base/declare", "dijit/form/Simple

阳光穿透心脏的1/2处/ 2022年08月04日 15:43/ 0 赞/ 180 阅读

相关 dojo小例子（34）带Ajax异步验证功能的ValidationTextBox

define([ "dojo/_base/declare", "dijit/form/ValidationTextBox", "doj

古城微笑少年丶/ 2022年08月04日 15:00/ 0 赞/ 167 阅读

相关 dojo小例子（33）dojo.request.script通过JSONP实现跨域

dojo/request/script通过JSONP实现跨域请求数据，需要后台配合返回Javascript代码： require(["dojo/request/scr

Dear 丶/ 2022年08月04日 15:00/ 0 赞/ 226 阅读

相关关于动态创建input checkbox的应用

业务场景: 为列表加上复选框,选中的则将值填充到一个文本框,最多允许填充10个.列表为动态创建的,可翻页. 代码实现: 1.对复选框的操作

淡淡的烟草味﹌/ 2022年07月15日 05:49/ 0 赞/ 246 阅读