holm/egroupware
1
1
Fork 0
forked from extern/egroupware
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Fix Taglist new free entry replacing other selected options

Browse Source
This commit is contained in:
Hadi Nategh 2022-03-23 18:16:19 +01:00
parent f5c1e21ee8
commit d13d039349
2 changed files with 48 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
api/js/etemplate/Et2Taglist/Et2Taglist.ts
View File

@ -121,6 +121,9 @@ export class Et2Taglist extends Et2widgetWithSelectMixin(LionCombobox)
if (this._inputNode.value == _value)
{
this.set_value(this.getValue().concat([this._inputNode.value]));
// reset the entered value otherwise to clean up the inputbox after
// new entry has been set as new value and option.
this._inputNode.value = '';
}
this.removeEventListener('form-element-register', modelValueChanged);
};
@ -128,6 +131,30 @@ export class Et2Taglist extends Et2widgetWithSelectMixin(LionCombobox)
}
/**
* @override of _listboxOnKeyDown
* @desc
* Handle various keyboard controls; UP/DOWN will shift focus; SPACE selects
* an item.
*
* @param {KeyboardEvent} ev - the keydown event object
* @protected
*/
_listboxOnKeyDown(ev) {
const { key } = ev;
// make sure we don't mess up with activeIndex after a free entry gets added into options
// it's very important to intercept the key down handler before the listbox (parent) happens.
if (key === 'Enter' && this.allowFreeEntries && this._inputNode.value
&& !this.formElements.filter(_o=>{return _o.choiceValue == this._inputNode.value;}).length)
{
this.activeIndex = -1;
}
super._listboxOnKeyDown(ev);
}
/**
* @param {string} v
* @protected

29
api/js/etemplate/Et2Taglist/TaglistSelection.ts
View File

@ -18,6 +18,11 @@ import {taglistStyles} from "./TaglistStyles";
* Implementation of selection tags
*/
export class TaglistSelection extends LitElement {
/**
* keeps last backspace status
*/
protected _removeOnBackspace = false;
static get properties() {
return {
comboxElement: {type: Object},
@ -209,16 +214,24 @@ export class TaglistSelection extends LitElement {
* @param ev
*/
__inputOnKeyup(ev) {
if (ev.key === 'Backspace') {
if (!this._inputNode.value && this._canBeClosed()) {
if (this.__getSelectedTags().length) {
this.__getSelectedTags()[this.__getSelectedTags().length - 1].checked = false;
const { key } = ev;
switch(key)
{
case 'Backspace':
if (!this._inputNode.value && this._canBeClosed()) {
if (this.__getSelectedTags().length && this._removeOnBackspace) {
this.__getSelectedTags()[this.__getSelectedTags().length - 1].checked = false;
}
this._removeOnBackspace = true;
}
}
else
{
this._removeOnBackspace = false;
}
break;
}
//todo: setting a new option value changes option indexes therefore the last activeIndex should be adopted according
// to our new options' indexes. We need to figure out how to set that index before the last selected option gets unchecked.
this._getComboBoxElement().activeIndex = this.__getSelectedTags().length;
if (key !== 'Backspace') this._removeOnBackspace = false;
}
}
customElements.define('taglist-selection', TaglistSelection);