PDA

View Full Version : redux : checbox setValue(true) doesnt work in IE6



sjivan
3 Aug 2007, 5:15 AM
- Ext version : 1.1 final
- yui adapter
- windows xp
- IE 6.0.29 SP2

I realize that this issue has been posted before but I wasn't able to find a solution. setValue(true) on a checkbox or creating a checkbox with config proeprty checked : true still does not work in IE 6 even with Ext 1.1 release. After investigating the issue I found this useful link http://forums.microsoft.com/MSDN/ShowPost.aspx?PostID=842144&SiteID=1 which goes over all combinations of IE / checkbox / creation method / set value combinations. I then looked at the GWT CheckBox code and the GWT code does



public void setChecked(boolean checked) {
DOM.setElementPropertyBoolean(inputElem, "checked", checked);
DOM.setElementPropertyBoolean(inputElem, "defaultChecked", checked);
}


which is consistent with the findings in the aforementioned article.

So I updated the code locally in Ext such that Checkbox#setValue has



setValue : function(v){
this.checked = (v === true || v === 'true' || v == '1' || String(v).toLowerCase() == 'on');
if(this.el && this.el.dom){
this.el.dom.checked = this.checked;
this.el.dom.defaultChecked = this.checked;
}
this.fireEvent("check", this, this.checked);
}


and this now works with IE 6. There are other places in Ext where checkboxes are used and a similar logic should be applied there as well. For example in the TreeNodeUI with checkbox.

I realize this is a browser bug but feel that the Ext code should be updated to handle this IE 6 quirk.

Sanjiv

jack.slocum
3 Aug 2007, 11:10 AM
In what instances does this occur? I have been able to duplicate it at all.

sjivan
3 Aug 2007, 1:44 PM
I went back and looked at your dynamic forms example and see that your last form has a checked checkbox. Sorry, I should have investigated the issue further. So the issue occurs only when a checked checkbox is moved in the browser DOM which I something I need to do.

To reproduce the issue, add the following div to dynamic.html from the samples



<div id="cb-test" style="background-color:yellow;"></div>


Then in dynamic.js add the following code



form.render('form-ct4');

//add this line
document.getElementById('cb-test').appendChild(form.el.dom);


You will see that the checked checkbox is no longer checked.

I've found some references indicating this IE 6 bug and that setting the checkbox / radiobox property 'defaultChecked' does the trick.

http://claudio.cicali.org/article/90/ie-6-and-the-checked-checkbox

http://lists.whatwg.org/pipermail/whatwg-whatwg.org/2006-January/005390.html

Thanks,
Sanjiv

jack.slocum
3 Aug 2007, 5:46 PM
Ah. Thanks for the further explanation. I will make the change.