radiofield rendering as checkboxfield

[RussellYermal]

Hey gang!

For some reason radiofields are rendering as checkfields in my app.
They have the checkbox icon instead of the radio icon, and I can select
multiple of them simultaneously.

Additionally, the app will crash if I assign multiple radiofields with the
same "name" config. I have inspected the elements and it appears that
the checkbox appearance is coming from apple.css, and I know I can
get around that with my own custom stylesheet, but I'm perplexed as
to why I cannot assign multiple radiofields with the same name, and
why I can "check" multiple radiofields. Here is my code and a screenshot:

Ext.define( 'App.view.VehicleInfoEdit' , {
    extend: "Ext.form.Panel" ,
    xtype: "vehicleInfoEdit" ,
    config: {        
        
        items: [ 
            {    xtype: 'fieldset' ,
                title: 'Vehicle Information' ,
                defaults: {
                    labelAlign: 'top' ,
                    useClearIcon: true ,
                    autoCapitalize : false
                } ,
                items: [
                    
{
                        name : 'nickname' ,
                        label: 'Nickname' ,
                        xtype: 'textfield'
                    } ,
                    {
                        xtype: 'ErrorField' ,
                        fieldname: 'nickname' 
                    } ,
                    {
                        name: 'appraised_by' ,
                        label: 'Appraised By' ,
                        xtype: 'textfield' ,
                        disabled: true
                    } ,
                    {
                        name: 'VIN' ,
                        label: 'VIN' ,
                        xtype: 'textfield' 
                    } ,
                    {
                        xtype: 'ErrorField' ,
                        fieldname: 'VIN' 
                    } ,
                    {
                        xtype: 'radiofield' ,
                        name: 'style' , 
                         value: 'GLS' ,


                        label: 'GLS' ,
                        checked: true
                    } ,
                    {
                        xtype: 'radiofield' ,
                         name: 'style' , 
                         value: 'SE' , 
                        label: 'SE' 
                    } ,
                    {
                        xtype: 'radiofield' ,
                         name: 'style' , 
                         value: 'Limited' , 
                        label: 'Limited' 
                    } ,
                    {
                        xtype: 'radiofield' ,
                         name: 'style' , 
                         value: 'Limited 2.0T' , 
                        label: 'Limited 2.0T' 
                    } 
                ]
            }             
        ] 
    }
});

Screen Shot 2012-05-02 at 4.48.58 PM.png

[RussellYermal]

UPDATE: I upgraded to the latest apple.css, which fixed the checkbox appearance.

However, it still looks like I can select multiple radiofields, and on further inspection
I'm getting this error in the console when I select a radiofield:

Uncaught TypeError: Cannot call method 'replace' of null

[RussellYermal]

Regarding the multiple radiobox's with the same name bug, it's actually an error
in the documentation example. The correct config is "fieldname", not "name".
Please update the docs at
http://docs.sencha.com/touch/2-0/#!/api/Ext.field.Radio

The only issue remaining is the error when I select a radiofield.

[RussellYermal]

Finally, the big error is in Sencha Touch 2. The getName() function returns the
"name" property, rather than fieldname. "name" is null, and it tries running a
replace() function on null, causing the error. getName() needs to be updated to
getFieldName or getFieldname and all code references to "name" need to be
updated.

Can someone post a fix for now until this is patched?

[RussellYermal]

Upon further inspection, Sencha Touch 2 also doesn't add the
correct "name" element when rendering the input. I tried to
fix the issue myself temporarily by changing line 60656 in
sencha-touch-all-debug.js from name = this.getName()to name = this.config.fieldname, and that stops the error,
but it still prevents other radios with the same fieldname from
being unchecked because the query on line 60673,
elements = Ext.query('[name=' + name + ']', component.element.dom);
doesn't find any elements with the name set as all the radiobox inputs
are generated without a name property.

[RussellYermal]

This is a real bug, was hoping someone could at least reply and let me know it's being worked on, and attach a patch if possible?

[RussellYermal]

Can I please get some kind of feedback/update on this? It really puts me in a sticky position to not have working radiofields :/

[RussellYermal]

Ugh.. I figured this out. The "name" property works fine, but "style" must be a reserved word somewhere because it was the name "style" that was causing the error. Changing the name from "style" fixed the error