ember-select-2 icon indicating copy to clipboard operation
ember-select-2 copied to clipboard

Add tagging support

Open phipps73 opened this issue 10 years ago • 8 comments

Would it be possible to add the tagging support so that a tag can be added that is not in the current dataset? Whilst it is possible to set multiple 'tags' where the data exists it isn't possible to enter a completely new value.

For example, given the data: ['red','green','blue'] and setting the multiple option to true I can select 'red' and 'blue'. However, I would also like to add another colour, e.g. 'orange'. The value would then be: ['red','blue','orange'].

See the Tagging Support section here: http://ivaynberg.github.io/select2/

Hopefully that would be an easy addition?

Many thanks

phipps73 avatar Jun 25 '14 14:06 phipps73

I am definitely considering this as an option that can be enabled via a tagging=true binding. I think, however, that this mode only makes sense when using the optionValuePath mode because entering new tags cannot create new complex objects (unless there is a delegate object and protocol delegating the creation of new objects to the original data source, but I think this is way beyond the general use case).

So I'd say that enabling tagging would be a nice addition for value-binding only.

iStefo avatar Jun 28 '14 13:06 iStefo

:+1: This would finish of this whole component! Tried to implement this but could not do it. Problems with Ember Data ArrayProxy, because you need to call pushObject but select2 treats it as a native javascript array. @iStefo Are you still planning on implementing this feature?

koemeet avatar Nov 26 '14 19:11 koemeet

@iStefo, Tagging support for value-binding only will be a great feature. :+1: When do you think this feature is available?

vsymguysung avatar Jan 08 '15 16:01 vsymguysung

I'm adding a attribute 'tags' and then around https://github.com/iStefo/ember-select-2/blob/6d4abbf80b7e68bacf275400899960609bcc90b1/addon/components/select-2.js#L194 adding the following to support my use case.

else if (self.get('tags')) {
  val = {id: query.term, text: query.term}
  if (!results.anyBy('id', query.term)){
    results.push(val);
  }
}

Maybe not very generalised but might help somebody.

mrloop avatar Feb 18 '15 17:02 mrloop

Having played with @mrloop 's workaround, tried using createSearchChoice, I realised I could implement this at the app layer easily by just appending to the array resolved by the query action. Is there actually any difference apart from ease of use?

jrhe avatar Feb 27 '15 15:02 jrhe

@iStefo Are you keen to get this implemented? I am using tagging multiple places in my app and it would be very useful to get some sort of functionality worked out and merged in.

jrhe avatar Mar 03 '15 19:03 jrhe

I will try and implement this feature now, including Ember Data support. For me to support ember data, there is one requirement, that is that the value binding needs to be an Ember Data DS.RecordArray (this way I can get the type of the data model, so we do not need some kind of factory mechanism). Also, we can reuse the optionLabel and optionValue path as usual.

Please, let me know if the most common use case is when your tags are ember data has many relationships.

koemeet avatar May 06 '15 20:05 koemeet

@jrhe thanks for the tip, had to rework some of my code and moved tagging into the app layer as suggested using the query action, no longer relying on a hack fork of ember-select-2 :boom: @steffenbrem not sure what the most common use case is, though tags as ember data has many relationships sounds right.

mrloop avatar Jun 03 '15 08:06 mrloop