Form & multiple fields same name

[Alexander Bauer]

Hi there,

I just want to share some code snippet. I had the requirement showing multiple textfields with the same name. You may ask, wtf?! Only one of them would be updatable, all others are read only. I did not want to update them manually, since I used form.loadRecord();. That approach updated only the first of the fields.
However, if you have a similar requirement, here you go:

Ext.override(Ext.form.Basic, {
    setValues: function(values) {
        var me = this,
            fields = this.getFields(),
            v, vLen, val, field, idx;
    
        function setVal(fieldId, val) {
              for(idx in fields.items) {
                field = fields.items[idx];
                if(field.id == fieldId || field.getName() == fieldId) {
                    field.setValue(val);
                    
                    if (me.trackResetOnLoad) {
                        field.resetOriginalValue();
                    }
                }
            } 
        }
        
        if (Ext.isArray(values)) {
            // array of objects
            vLen = values.length;


            for (v = 0; v < vLen; v++) {
                val = values[v];
                setVal(val.id, val.value);
            }
            
        } else {
            // object hash
            Ext.iterate(values, setVal);
        }
        
        return this;
    }
});

as a side effect, loadRecords performs a bit faster (just few ms, not really mentionable). I would appreciate if you have some improvements or code corrections.

[scottmartin]

I would try using a convert field to allow for duplicate field data with different names
(convert = calculated field)
http://docs.sencha.com/ext-js/4-1/#!...ld-cfg-convert

Scott.

[Alexander Bauer]

Probably I wasnt clear enough (my english skills are not that good), anyway.. convertong wont help. I have a Form with more than one field with the same Name, the Form is devided in separate sections (visually). I populate the Form using loadRecord();. Without the override it would fill the First found formField (findBy). Since setValues iterates through the model fields, it will try to find a field by the model fieldname which occurs once and therefore fills only the first formField of a form. This override will iterate through all fields and apply the value to each field matching the Name.



// edit

sorry for that bold stuff, writing on wp7.5 and its a Bit hard.. also the German spelling correction is freaking me out..

[scottmartin]

OK, you are offering code .. my mistake.

Scott.

[mpost]

Thanks, this was exactly what I was looking for. It would be nice if this functionality got rolled into the framework, perhaps via a config value (allowRepeatedNames: true or some such).

Here's your functionality wrapped up into a plugin so it can hopefully be yanked out when Sencha offers this functionality natively:

Ext.define('Ext.ux.RepeatedNames',    {
        extend: 'Ext.AbstractPlugin',
        alias: 'plugin.form-repeated-names',


        init: function (client)
        {
            if (Ext.isEmpty(client) || client.getXType() !== 'form')
                Ext.Error.raise({ msg: 'RepeatedNames plugin can only be used in a form panel' });


            var basic = client.getForm();
            if (Ext.isEmpty(basic))
                return;


            Ext.override(basic,
                {
                    setValues: function (values)
                    {
                        var me = this,
                            fields = this.getFields(),
                            v, vLen, val, field, idx;


                        function setVal(fieldId, val)
                        {
                            for (idx in fields.items)
                            {
                                field = fields.items[idx];
                                if (field.id == fieldId || field.getName() == fieldId)
                                {
                                    field.setValue(val);


                                    if (me.trackResetOnLoad)
                                        field.resetOriginalValue();
                                }
                            }
                        }


                        if (Ext.isArray(values))
                        {
                            // array of objects
                            vLen = values.length;


                            for (v = 0; v < vLen; v++)
                            {
                                val = values[v];
                                setVal(val.id, val.value);
                            }


                        }
                        else    // object hash
                            Ext.iterate(values, setVal);


                        return this;
                    }
                }
            );
        }
    }
);