X-Git-Url: http://git.ithinksw.org/extjs.git/blobdiff_plain/6e39d509471fe9b4e2660e0d1631b350d0c66f40..3789b528d8dd8aad4558e38e22d775bcab1cbd36:/examples/ux/FieldReplicator.js?ds=inline diff --git a/examples/ux/FieldReplicator.js b/examples/ux/FieldReplicator.js index 89ed41d2..dbb2f77b 100644 --- a/examples/ux/FieldReplicator.js +++ b/examples/ux/FieldReplicator.js @@ -1,80 +1,49 @@ -/*! - * Ext JS Library 3.1.0 - * Copyright(c) 2006-2009 Ext JS, LLC - * licensing@extjs.com - * http://www.extjs.com/license +/** + * @class Ext.ux.FieldReplicator + *
A plugin for Field Components which creates clones of the Field for as + * long as the user keeps filling them. Leaving the final one blank ends the repeating series.
+ *Usage:
+ *
+ {
+ xtype: 'combo',
+ plugins: [ Ext.ux.FieldReplicator ],
+ triggerAction: 'all',
+ fieldLabel: 'Select recipient',
+ store: recipientStore
+ }
+ *
*/
-Ext.ns("Ext.ux");
-
-/**
- * @class Ext.ux.FieldReplicator
- * A plugin for Field Components which creates clones of the Field for as - * long as the user keeps filling them. Leaving the final one blank ends the repeating series.
- *Usage:
- *
- {
- xtype: 'combo',
- plugins: [ Ext.ux.FieldReplicator ],
- triggerAction: 'all',
- fieldLabel: 'Select recipient',
- store: recipientStore
- }
- *
- */
-Ext.ux.FieldReplicator = {
- init: function(f) {
- f.replicator = this;
- f.enableKeyEvents = true;
- f.on('change', this.onChange, this);
- f.onKeyDown = f.onKeyDown.createInterceptor(this.onKeyDown);
- },
-
-// If tabbing out and the change event will be fired, flag that
-// the change handler must focus the correct sibling Field.
- onKeyDown: function(e) {
- if ((e.getKey() == Ext.EventObject.TAB) && (String(this.startValue) !== String(this.getValue()))) {
- if (e.shiftKey) {
- this.focusPrev = true;
- } else if (!e.shiftKey && !e.altKey) {
- this.focusNext = true;
- }
- }
- },
-
-// Handle the field either being changed to blank or from blank.
- onChange: function(f, n, o) {
- var c = f.ownerCt, l,
- ps = f.previousSibling(),
- ns = f.nextSibling();
- if (Ext.isEmpty(n)) {
- if (!Ext.isEmpty(o)) {
-// The Field has been blanked, and it is not the only one left, remove it
- if ((ps && (ps.replicator === this)) || (ns && (ns.replicator === this))) {
- l = f.findParentBy(function(p) {
- return !Ext.isDefined(p.ownerCt);
- });
- c.remove(f);
- l.doLayout();
- }
- }
- } else {
- if (Ext.isEmpty(o)) {
-// Field filled, insert a clone as the next sibling
- ns = new f.constructor(f.cloneConfig());
- c.insert(c.items.indexOf(f) + 1, ns);
- c.doLayout();
- l = f.findParentBy(function(p) {
- return !Ext.isDefined(p.ownerCt);
- });
- l.doLayout();
- }
- }
- if (f.focusPrev) {
- delete f.focusPrev;
- ps.focus(false, true);
- } else if (f.focusNext) {
- delete f.focusNext;
- ns.focus(false, true);
- }
- }
-};
\ 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