CheckboxのboxLabelを動的に変更する

[kuroneko]

初めまして、よろしくお願いいたします。

FormのCheckboxのチェックのON/OFFによって、
boxLabelが変更されるということは可能でしょうか？

APIをみて自分なりに試してみたり、
英語のフォーラムをのぞいてみたりしたのですが、
全く近づく気配が感じれませんでしたので、質問させていただきました。

申し訳ございませんが、どうぞよろしくお願いいたします。

[amanoman]

確かに、boxLabelの値を変更する為のメソッドは見つかりませんね。
boxLabelプロパティーの値を変更しても変わらない…
で、プラグインを作って見ました。お試しあれ！！
ExtJS 2.X用です。


/**
* @class Ext.ux.CheckBoxLabelSet
* Ext.form.CheckboxにsetBoxLabelメソッドを追加するプラグイン(Ext.form.Radioにも適用可能)
* メソッド：setBoxLabel
* パラメータ：文字列(変更したいboxLabelの値)
* 実装サンプル:
* チェックボックスの値が変更されたらboxLabelを変更する。
* var checkbox=new Ext.form.Checkbox({
* boxLabel:'FALSE',
* plugins:new Ext.ux.CheckBoxLabelSet(),
* handler:function(c,v) {
* if (v) {
* //プラグインで追加されたメソッド
* c.setBoxLabel('TRUE');
* } else {
* //プラグインで追加されたメソッド
* c.setBoxLabel('FALSE');
* }
* }
* });
* checkbox.render(document.body);
*
* @constructor
* Ext.ux.CheckBoxLabelSetプラグインの生成
*/
Ext.ns('Ext.ux.CheckBoxLabelSet');
Ext.ux.CheckBoxLabelSet=function() {
this.init=function(cmp) {
cmp.setBoxLabel=function(label) {
if (label) {
this.boxLabel=label;
if (!this.labelEl) {
this.labelEl = this.innerWrap.createChild({
tag: 'label',
htmlFor: this.el.id,
cls: 'x-form-cb-label',
html: this.boxLabel
});
} else {
this.labelEl.update(this.boxLabel);
}
}
}
}
}

[kuroneko]

わざわざプラグインを作成していただきまして、ありがとうございました。

当方のがExtJS 2.1であった為、innerWrapでエラーが発生していました。

でも、ここまでしていただけたので、もう少し自分でがんばってみたいと思います。

ありがとうございました。

[amanoman]

わざわざプラグインを作成していただきまして、ありがとうございました。

当方のがExtJS 2.1であった為、innerWrapでエラーが発生していました。

でも、ここまでしていただけたので、もう少し自分でがんばってみたいと思います。

ありがとうございました。
>当方のがExtJS 2.1であった為、innerWrapでエラーが発生していました。
知りませんでした。:((
私は、2.2.1で動作確認をしていたので勉強になりました。