CODEWITHSUNDEEP
aem
Pakira
Pakira

Reputation: 2021

Single select Tag in Touch UI

OOTB Tag has multi select functionality, Is it possible to create single select Tag in Touch UI? If yes, can you point me which js file I need to modify?

Upvotes: 1

Views: 1494

Answers (1)

Mateusz Chromiński
Mateusz Chromiński

Reputation: 2832

The cq:tags property is rendered by CUI.TagList widget that can be found within /etc/clientlibs/granite/coralui2/js/coral.js script.

Reading it you can learn that the widget raises itemadded event which might be helpful for you to handle the singular tag handling. An example function that can catch the event might be placed in any clientlibs that will be attached to the admin interface such as cq.authoring.dialog clientlib.

$('*[data-fieldname="./cq:tags"]').on('itemadded', function(ev, value) {
    var el = $(ev.target),
        div = el.siblings('div'),
        input = div.find('input'),
        button = div.find('button');
    input.prop('disabled', true);
    button.remove();
}

To have the fully functional flow you need to handle the itemremoved event as well and make the input field enabled again as well as add the button back to the widget.

Upvotes: 2

Related Questions