読者です 読者をやめる 読者になる 読者になる

めも、メモる

技術的メモ. Sencha/C#など。

ExtJSでcheckboxにfalseを指定する

取得したチェックボックスの全てをチェックする/チェックをはずすの処理を実行するとき。Ext.selectしてset({checked: true)はできるけど、set({checked: false})は動かない。

set({checked: false}, false)なら動く。<input checked> でcheckedを削除するにはこうする必要がある、ということらしい。

 

Yes, a bit of a challenge, but I learned some good stuff while investigating! This is how checking/unchecking checkboxes should ideally be done in ExtJS:

var checkall = function() {
 Ext.select('input[type=checkbox]').set({checked: true}, false);
}

var uncheckall = function() {
 Ext.select('input[type=checkbox]').set({checked: false}, false);
}

 

Normally, Ext.Element.set() uses the DOM method HTMLElement.setAttribute() under the hood, but what we want in this case is not setAttribute('checked', false), but rather removeAttribute('checked'), since the checked state of the checkbox depends on whether or not the attribute is present, not its value. Passing the optional second parameter as false indicates that the set method should bypass the normal setAttribute() call and set the property directly on the underlying DOM element, which is what we want. The underlying effect is exactly the same as your workaround of "el.dom.checked=false", but is a bit cleaner-looking. ;) The parameter is in the docs here (http://docs.sencha.com/ext-js/4-0/#!/api/Ext.Element-method-set), but without much explanation. If you follow the link to the source (http://docs.sencha.com/ext-js/4-0/source/Element2.html#Ext-Element-method-set), however, it becomes readily apparent what is going on.

Hope that answers things for you! And thanks for the interesting question - I certainly learned a lot in my poking around to figure it out! :)

 http://www.sencha.com/forum/archive/index.php/t-150097.html?s=cf4568fa1a674907f9cbe2c5b4b49c2a