Dynamic form fields : cloning fields and fieldsets on the fly

[jaibeee]

This plugin is great but similar to sonny it didn't have one basic method that would complete it's greatness.

I have fixed sonny's idea on implementing a removeClones in the Ext.form.FormPanel override.

Here is how I did it.

I added removeClones into Ext.form.FormPanel which as it says removes cloned components from the panel.

    removeClones : function(ns, xtype) {
        Ext.each(this.findFormComponents(ns, xtype), function(fst) {
            if(fst.isClone()) {
                fst.remove();
            }
        }, this);
    }

Then in Ext.form.Fieldset and Ext.form.Field add a check for clones and the actual removal of the component .

The isClone method is just a convenient accessor to determine if a component is a clone.

    isClone : function() {
        if (this.dynamic && this.clone) {
            return true;
        }else {
            return false;
        }
    }

The remove method just removes the component from it's parent and call doLayout to reflect the removed component.

    remove : function() {
        var panel = this.ownerCt;
        panel.remove(this, true);
        panel.doLayout();
    }

Finally, now you can remove all clones by calling removeClones. I used this method in my Ext.form.FormPanel reset method which works great.

I hope this is useful to someone. Please let me know if there are any problems with it.

Arnold, I know it's ages since you wrote this plugin but I think it's a great plugin and wouldn't mind you including this in your release. I hope that as I continue removing bugs or add good-to-have features that it improves what you started with.

[darestyan]

how to count already clones of fieldset? and checking with maxOccurs configuration.
if there is already clones and less than maxOccurs then set alert "fieldset must be added of maxOccurs!"

thanks before.

[lamasgergo]

HI!!!

Yeah this is a great plugin. But in Ext 3.x dynamic fields remove not works because i have got same error up before.

I think its not a big problem if yuo override Ext.Element insertAfter function. Becaouse the element has not parentNode so this cause an error.
Just check if its exists than insertBefore.

Ext.override(Ext.Element,{


insertAfter:function(el){
if((el = Ext.getDom(el)).parentNode) (el = Ext.getDom(el)).parentNode.insertBefore(this.dom, el.nextSibling);
return this;
}
}
);