-Ext.ns("Ext.ux");\r
-\r
-/**\r
- * @class Ext.ux.FieldReplicator\r
- * <p>A plugin for Field Components which creates clones of the Field for as\r
- * long as the user keeps filling them. Leaving the final one blank ends the repeating series.</p>\r
- * <p>Usage:</p>\r
- * <pre><code>\r
- {\r
- xtype: 'combo',\r
- plugins: [ Ext.ux.FieldReplicator ],\r
- triggerAction: 'all',\r
- fieldLabel: 'Select recipient',\r
- store: recipientStore\r
- }\r
- * </code></pre>\r
- */\r
-Ext.ux.FieldReplicator = {\r
- init: function(f) {\r
- f.replicator = this;\r
- f.enableKeyEvents = true;\r
- f.on('change', this.onChange, this);\r
- f.onKeyDown = f.onKeyDown.createInterceptor(this.onKeyDown);\r
- },\r
-\r
-// If tabbing out and the change event will be fired, flag that\r
-// the change handler must focus the correct sibling Field.\r
- onKeyDown: function(e) {\r
- if ((e.getKey() == Ext.EventObject.TAB) && (String(this.startValue) !== String(this.getValue()))) {\r
- if (e.shiftKey) {\r
- this.focusPrev = true;\r
- } else if (!e.shiftKey && !e.altKey) {\r
- this.focusNext = true;\r
- }\r
- }\r
- },\r
-\r
-// Handle the field either being changed to blank or from blank.\r
- onChange: function(f, n, o) {\r
- var c = f.ownerCt, l,\r
- ps = f.previousSibling(),\r
- ns = f.nextSibling();\r
- if (Ext.isEmpty(n)) {\r
- if (!Ext.isEmpty(o)) {\r
-// The Field has been blanked, and it is not the only one left, remove it\r
- if ((ps && (ps.replicator === this)) || (ns && (ns.replicator === this))) {\r
- l = f.findParentBy(function(p) {\r
- return !Ext.isDefined(p.ownerCt);\r
- });\r
- c.remove(f);\r
- l.doLayout();\r
- }\r
- }\r
- } else {\r
- if (Ext.isEmpty(o)) {\r
-// Field filled, insert a clone as the next sibling\r
- ns = new f.constructor(f.cloneConfig());\r
- c.insert(c.items.indexOf(f) + 1, ns);\r
- c.doLayout();\r
- l = f.findParentBy(function(p) {\r
- return !Ext.isDefined(p.ownerCt);\r
- });\r
- l.doLayout();\r
- }\r
- }\r
- if (f.focusPrev) {\r
- delete f.focusPrev;\r
- ps.focus(false, true);\r
- } else if (f.focusNext) {\r
- delete f.focusNext;\r
- ns.focus(false, true);\r
- }\r
- }\r
-};
\ No newline at end of file
+Ext.define('Ext.ux.FieldReplicator', {
+ singleton: true,
+
+ init: function(field) {
+ // Assign the field an id grouping it with fields cloned from it. If it already
+ // has an id that means it is itself a clone.
+ if (!field.replicatorId) {
+ field.replicatorId = Ext.id();
+ }
+
+ field.on('blur', this.onBlur, this);
+ },
+
+ onBlur: function(field) {
+ var ownerCt = field.ownerCt,
+ replicatorId = field.replicatorId,
+ isEmpty = Ext.isEmpty(field.getRawValue()),
+ siblings = ownerCt.query('[replicatorId=' + replicatorId + ']'),
+ isLastInGroup = siblings[siblings.length - 1] === field,
+ clone, idx;
+
+ // If a field before the final one was blanked out, remove it
+ if (isEmpty && !isLastInGroup) {
+ Ext.Function.defer(field.destroy, 10, field); //delay to allow tab key to move focus first
+ }
+ // If the field is the last in the list and has a value, add a cloned field after it
+ else if(!isEmpty && isLastInGroup) {
+ clone = field.cloneConfig({replicatorId: replicatorId});
+ idx = ownerCt.items.indexOf(field);
+ ownerCt.add(idx + 1, clone);
+ }
+ }
+
+});
\ No newline at end of file