Differentiate new tags in Select2 for Vue

Viewed 331

When I add new tags with select2 and vue, their value is the text of the tag, while for existing tags it is the ID. Is there a way to differentiate which labels are new and which ones are old? Is it possible to save value and text?

When I submit the form, I want to check which ones are new and which are old, because the new ones I would add them to the DB.

I have this code in the mounted function:

`mounted: function () {
        var vm = this
        $(this.$el)
            // init select2
            .select2({ 
                placeholder: this.placeholder,
                ajax: this.ajaxOptions,
                data: this.options,
                theme: this.theme,
                tags: this.tags,
                createTag: function (params) {
                    return {
                        id: params.term,
                        text: params.term,
                        newOption: true
                    }
                },
                templateResult: function (data) {
                    var $result = $("<span></span>");
                    $result.text(data.text);
                    if (data.newOption) {
                        $result.append(" <em>(new)</em>");
                    }
                    return $result;
                },
                minimumInputLength: this.minimumInputLength,
                minimumResultsForSearch: this.minimumResultsForSearch,
            .val(this.value)
            .trigger('change')
            .on('change', function (ev, args) {
                vm.$emit('input', $(this).val())
            });

Thank you! },`

0 Answers
Related