ホームページ > ウェブフロントエンド > jsチュートリアル > CheckBoxGroup のインスタンスの動的作成について

CheckBoxGroup のインスタンスの動的作成について

零下一度
リリース: 2017-07-18 15:55:47
オリジナル
3014 人が閲覧しました

実際、CheckBoxGroup の動的作成についてはインターネット上にたくさんの情報があります。なぜこの記事を書いたかというと、ext3 にはまだ落とし穴があるからです。

Extjs3.0 の CheckboxGroup は、デフォルトでは項目を動的に追加できません。 Ext.form.Field を継承していますが、コンテナに似ています。
CheckboxGroup 構成で処理される項目は、対応するパネルを生成します。この処理プロセスは 1 回だけであるため、CheckboxGroup を動的に追加することは困難です。

	var checkBoxGroupTypes = new Ext.form.CheckboxGroup({
		xtype:'checkboxgroup',
 		fieldLabel:'请选择对应电厂',
 		columns:9,
 		width: 600, 
 		name:'plantGroup'
	});
	
	/*这里采用jquery的ajax请求,为解决同步异步问题
	 * 这里async 必须设置成false
	 * 否则页面加载时,无法将动态创建的checkBoxGroup添加到容器中*/
	$.ajax({
		url : plantGroupUrl,
		method : 'POST',
		async : false,
		cache : true,
		success : function(response){
			
			var res = response;
			var resLen = res.length;
			var items = [];
			for(var i = 0;i<res.length;i++){
				var data = res[i];
				var chb = {boxLabel:data.BRIEFNAME,name:data.CODE,inputValue:data.CODE,checked:true};
				items.push(chb);
			}
			
			checkBoxGroupTypes.items = items;
			checkBoxGroupTypes.doLayout();
		}
	});
ログイン後にコピー
/*这里采用jquery的ajax请求,为解决同步异步问题
	 * 这里async 必须设置成false
	 * 否则页面加载时,无法将动态创建的checkBoxGroup添加到容器中*/
ログイン後にコピー

実際、ここで注目すべきはこのコメントです。単純ではありますが、この問題は昨夜私に頭を悩ませたので、単に考えていませんでした。インスピレーションで目が覚めました。

以下はオンライン方法とは異なり、作成したCheckBoxGroupをパネルに追加します。

りー

りー
りー

以上がCheckBoxGroup のインスタンスの動的作成についての詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のおすすめ
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート