diff --git a/templates/genericTemplates/filters.php b/templates/genericTemplates/filters.php index 6713b7b..3be1b09 100644 --- a/templates/genericTemplates/filters.php +++ b/templates/genericTemplates/filters.php @@ -104,7 +104,10 @@ echo $this->Bootstrap->modal([ $select = $filteringTable.closest('.modal-body').find('select.tag-input') let passedTags = [] tags.forEach(tagname => { - if (!$select.find("option[value='" + tagname + "']")) { + const existingOption = $select.find('option').filter(function() { + return $(this).val() === tagname + }) + if (existingOption.length == 0) { passedTags.push(new Option(tagname, tagname, true, true)) } }) diff --git a/webroot/js/main.js b/webroot/js/main.js index 20602a3..465969d 100644 --- a/webroot/js/main.js +++ b/webroot/js/main.js @@ -213,13 +213,24 @@ function initSelect2Pickers() { function initSelect2Picker($select) { - function templateTag(state) { + function templateTag(state, $select) { if (!state.id) { return state.label; } if (state.colour === undefined) { state.colour = $(state.element).data('colour') } + if ($select !== undefined && state.text[0] === '!') { + // fetch corresponding tag and set colors? + // const baseTag = state.text.slice(1) + // const existingBaseTag = $select.find('option').filter(function() { + // return $(this).val() === baseTag + // }) + // if (existingBaseTag.length > 0) { + // state.colour = existingBaseTag.data('colour') + // state.text = baseTag + // } + } return HtmlHelper.tag(state) } @@ -227,8 +238,8 @@ function initSelect2Picker($select) { placeholder: 'Pick a tag', tags: true, width: '100%', - templateResult: templateTag, - templateSelection: templateTag, + templateResult: (state) => templateTag(state), + templateSelection: (state) => templateTag(state, $select), }) }