[FIXED] [#1582] [4.5.2] TagField, paste of multiple items produce one SINGLE item into the TagField

  1. #1

    [FIXED] [#1582] [4.5.2] TagField, paste of multiple items produce one SINGLE item into the TagField

    Hello, we're experiencing an annoying issue when "pasting" a string containing more than one tag separated with comma into a TagField.

    It appears that the control "parses" the string correctly BUT takes ONLY THE FIRST tag.

    You can verify the issue on your samples at this URL:
    https://examples3.ext.net/#/Form/Tag/TagField/

    For example, try to paste "John,Bill" into the last TagField control and you'll see the result.

    Could you please help fixing the same?

    Thank you in advance,
    Adriano
  2. #2
    Hello @adrianot!

    Thanks for reporting the issue. In fact this feature is just not implemented in the TagField component. It only supports adding one tag at once.

    One initial development for this would be the following override:

    Ext.define("gh1582", {
        override: "Ext.net.TagField",
        setValue: function (value, opts) {
            var me = this,
                i,
                obj,
                v,
                matchedTags = [],
                len;
    
            opts = opts || { set: true };
    
            value = this.convertValue(value);
    
            if (this.store.loading) {
                me.value = value;
                return me;
            }
    
            for (i = 0, len = value.length; i < len; i++) {
                obj = this.convertToTag(value[i]);
    
                if (obj) {
                    matchedTags.push(obj);
                }
            }
    
            if (matchedTags.length > 0) {
                if (this.tagLabel) {
                    if (opts.append) {
                        this.tagLabel.add(matchedTags);
                    }
                    else if (Ext.isDefined(opts.index)) {
                        for (i = 0; i < matchedTags.length; i++) {
                            this.tagLabel.insert(opts.index + i, matchedTags[i]);
                        }
                    }
                    else if (opts.remove) {
                        for (i = 0; i < matchedTags.length; i++) {
                            obj = this.tagLabel.getByValue(matchedTags[i].value);
    
                            if (obj) {
                                this.tagLabel.remove(obj);
                            }
                        }
    
                    } else {
                        this.tagLabel.set(matchedTags);
                    }
                } else {
                    if (opts.append) {
                        this.value = Ext.Array.push(this.value || [], matchedTags);
                    }
                    else if (Ext.isDefined(opts.index)) {
                        this.value = Ext.Array.insert(this.value, opts.index, matchedTags[0]);
                    }
                    else if (opts.remove) {
                        this.value = Ext.Array.remove(this.value, matchedTags[0]);
                    }
                    else {
                        this.value = matchedTags;
                    }
    
                    this.checkChange();
                }
            } else {
                if (!opts.append && !Ext.isDefined(opts.index) && !opts.remove) {
                    if (this.tagLabel) {
                        this.tagLabel.set([]);
                    } else {
                        delete this.value;
                        this.checkChange();
                    }
                }
            }
    
            if (this.inputEl && this.emptyText && !Ext.isEmpty(this.value)) {
                this.inputEl.removeCls(this.emptyCls);
            }
    
            if (this.tagLabel && this.isExpanded) {
                this.alignPicker();
            }
        }
    });
    For a simple example it works fine but maybe it would be a problem if there's events that are triggered and require user interaction at every item addition.

    As this issue is also present in Ext.NET version 4, we've logged it under #1582 so that we can track and fix this for good.

    Thank you again for the report, and I hope the override helps!
    Fabrício Murta
    Developer & Support Expert
  3. #3
    Hello again, @adrianot!

    We've fixed this issue as far as Ext.NET 4 is concerned, the fix will be available next public release of Ext.NET.

    EDIT: just for the record, this thread was created in Ext.NET v3 forums and moved to bugs. The issue has been fixed in Ext.NET 4.

Similar Threads

  1. Replies: 1
    Last Post: Jul 13, 2015, 11:26 AM
  2. [CLOSED] Adding invalid item to TagField
    By RCN in forum 3.x Legacy Premium Help
    Replies: 2
    Last Post: Mar 25, 2015, 10:36 PM
  3. [CLOSED] TagField : How to allow duplicate Tag in TagField
    By matrixwebtech in forum 2.x Legacy Premium Help
    Replies: 13
    Last Post: Dec 31, 2014, 1:51 PM
  4. [CLOSED] TagField : Item count
    By matrixwebtech in forum 2.x Legacy Premium Help
    Replies: 2
    Last Post: Dec 30, 2014, 5:44 PM
  5. Replies: 2
    Last Post: May 02, 2014, 1:36 PM

Tags for this Thread

Posting Permissions