PDA

View Full Version : [FIXED-518][3.x/2.x] Bug in radiogroup when using brackets in name



2000man
17 Aug 2008, 1:22 PM
When I use square brackets (] or [) in the name of the items of a radiogroup (which is within a FormPanel), they don't work in Firefox. My code looks like this:


...
{ fieldLabel:'gender',
xtype: 'radiogroup',
items: [
{boxLabel: 'Female',inputValue:'f', name:'data[Student][gender]'},
{boxLabel: 'Male',inputValue:'m', name:'data[Student][gender]'}
]
}, ...

Actual Problem:
It renders correctly, but when I want to use them, an error occurs:


[Exception... "'Error parsing selector, parsing failed at "]"' when calling method: [nsIDOMEventListener::handleEvent]" nsresult: "0x8057001e (NS_ERROR_XPC_JS_THREW_STRING)" location: "<unknown>" data: no]

Line 0

Additional information:
The same happens when I use a single radiobutton with square-brackets in it's name. It works fine in Safari though...

Adapter used: ext-base
Firefox version: 2.0.0.16
OS: Mac OS 10.4.11

Btw: because I use CakePHP as underlaying framework, I need to use these brackets in the fieldnames.

Condor
17 Aug 2008, 9:58 PM
There is a problem with the regular expression for attribute matching in DomQuery.

A possible workaround is to alter the regular expression a bit (by making the closing quote mandatory after an opening quote) and use quotes in the Ext.form.Radio name (and optionally value) matching.

For Ext 2.x:

Ext.DomQuery.matchers[2] = {
re: /^(?:([\[\{])(?:@)?([\w-]+)\s?(?:(=|.=)\s?(["']?)(.*?)\4)?[\]\}])/,
select: 'n = byAttribute(n, "{2}", "{5}", "{3}", "{1}");'
};
Ext.override(Ext.form.Radio, {
getGroupValue : function(){
var c = this.getParent().child('input[name="'+this.el.dom.name+'"]:checked', true);
return c ? c.value : null;
},
toggleValue : function() {
if(!this.checked){
var els = this.getParent().select('input[name="'+this.el.dom.name+'"]');
els.each(function(el){
if(el.dom.id == this.id){
this.setValue(true);
}else{
Ext.getCmp(el.dom.id).setValue(false);
}
}, this);
}
},
setValue : function(v){
if(typeof v=='boolean') {
Ext.form.Radio.superclass.setValue.call(this, v);
}else{
var r = this.getParent().child('input[name="'+this.el.dom.name+'"][value="'+v+'"]', true);
if(r && !r.checked){
Ext.getCmp(r.id).toggleValue();
};
}
}
});

For Ext 3.x:

Ext.DomQuery.matchers[2] = {
re: /^(?:([\[\{])(?:@)?([\w-]+)\s?(?:(=|.=)\s?(["']?)(.*?)\4)?[\]\}])/,
select: 'n = byAttribute(n, "{2}", "{5}", "{3}", "{1}");'
};
Ext.override(Ext.form.Radio, {
getGroupValue : function(){
var p = this.el.up('form') || Ext.getBody();
var c = p.child('input[name="'+this.el.dom.name+'"]:checked', true);
return c ? c.value : null;
},
onClick : function(){
if(this.el.dom.checked != this.checked){
var els = this.getCheckEl().select('input[name="' + this.el.dom.name + '"]');
els.each(function(el){
if(el.dom.id == this.id){
this.setValue(true);
}else{
Ext.getCmp(el.dom.id).setValue(false);
}
}, this);
}
},
setValue : function(v){
if (typeof v == 'boolean') {
Ext.form.Radio.superclass.setValue.call(this, v);
} else {
var r = this.getCheckEl().child('input[name="' + this.el.dom.name + '"][value="' + v + '"]', true);
if(r){
Ext.getCmp(r.id).setValue(true);
}
}
return this;
}
});

2000man
17 Aug 2008, 11:40 PM
Yes, that works fine! I'll test it in Internet Explorer later on. Thanxs for the help. Is this going to be part of a future version, or is it to specific?

dewie
27 Nov 2008, 10:59 AM
This problem works fine for radios in a form.
But it results in an error when using checkbox in a tree
A single click doesn't get registered anymore ?

Condor
27 Nov 2008, 11:53 AM
This shouldn't affect checkboxes at all!

Are you using a normal tree with checkboxes or are you using my themed checkbox extension (http://www.extjs.com/forum/showthread.php?t=44369)?

Can you post an example?

dewie
27 Nov 2008, 12:03 PM
Sample code :


{
title: 'Rechten',
xtype: 'treepanel',

useArrows:true,
autoScroll:true,
animate:false,
enableDD:false,
containerScroll: true,

//dataUrl: '/customers/<%= @customer.id %>/permissions.json',

// auto create TreeLoader
loader: new Ext.tree.TreeLoader({
dataUrl:'/customers/<%= @customer.id %>/permissions.json',
requestMethod: 'get'

}),

root : new Ext.tree.AsyncTreeNode({
text : 'Main Package',
draggable :false ,// disable root node dragging
id :'0',
checked: false

})
}


I just use a normal tree with checkbox
It seems to be a problem in :


Ext.DomQuery.matchers[2].re = /^(?:([\[\{])(?:@)?([\w-]+)\s?(?:(=|.=)\s?(?:"(.*?)"|'(.*?)'|(.*?)))?[\]\}])/;

When i lose this statement it all works fine ? (except the radio's with brackets in a form :)

Condor
27 Nov 2008, 12:12 PM
Yes, the regexp was wrong. I've updated my code above.

dewie
27 Nov 2008, 12:16 PM
Thanks, worked like a charm, thank you very much !

Will keep it in mind in the future if i run into the same type of problem

wgpubs
20 Jul 2009, 9:49 AM
thanks much!

sgehrig
2 Feb 2010, 8:05 AM
Sorry - contents removed as I posted this one with the wrong account active,

teqneers
2 Feb 2010, 8:07 AM
Is there any chance that this gets fixed in the near future? The fix provided by Condor works and as brackets in HTML form element names are not that uncommon, I'd be nice if this fix can be introduced into the next release.

Thanks to whom it may concern ;-)

Best regards

Stefan

Jamie Avins
2 Feb 2010, 10:05 AM
Putting this in our tracker so it can be addressed.

mnc
28 Apr 2010, 7:28 AM
This is a common problem to anybody who has PHP on the serverside, as PHP parses the request params named like param[whatever] to arrays. Waiting for a fix. Thanks.

meroy
29 Dec 2010, 9:37 AM
This has been fixed in SVN.

Ext 3.3.x branch revision 7329
Ext Core 3.3.x branch revision 271