deblan-mirror/Choices
deblan-mirror/Choices
1
0
Fork 0
mirror of https://github.com/Choices-js/Choices.git synced 2024-05-17 04:56:34 +02:00
Code Issues Projects Releases Wiki Activity

Option to disable removing items + disabling editing items when other items are selected

Browse source
This commit is contained in:
Josh Johnson 2016-03-22 22:47:29 +00:00
parent ced83cd728
commit 4f79531b12
1 changed files with 32 additions and 22 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

54
assets/scripts/src/choices.js
View file

@ -19,6 +19,7 @@ export class Choices {
element: document.querySelector('[data-choice]'), element: document.querySelector('[data-choice]'),
disabled: false, disabled: false,
create: true, create: true,
removeItems: true,
editItems: false, editItems: false,
maxItems: false, maxItems: false,
delimiter: ',', delimiter: ',',
@ -121,23 +122,25 @@ export class Choices {
onKeyDown(e) { onKeyDown(e) {
let ctrlDown = e.ctrlKey || e.metaKey; let ctrlDown = e.ctrlKey || e.metaKey;
// Handle select all // If CTRL + A or CMD + A have been pressed and there are items to select
if (ctrlDown && e.keyCode === 65) { if (ctrlDown && e.keyCode === 65 && this.list && this.list.children) {
if(this.list && this.list.children) { let handleSelectAll = () => {
for (let i = 0; i < this.list.children.length; i++) { if(this.options.removeItems) {
let listItem = this.list.children[i]; for (let i = 0; i < this.list.children.length; i++) {
let listItem = this.list.children[i];
if(listItem.classList.contains('is-selected')) { // Select any items that have not already been selected
listItem.classList.remove('is-selected'); if(!listItem.classList.contains('is-selected')) {
} else { listItem.classList.add('is-selected');
listItem.classList.add('is-selected'); }
} }
} }
} };
handleSelectAll();
} }
// Handle enter key // If enter key is pressed and the input has a value
if (e.keyCode === 13 && e.target.value) { if (e.keyCode === 13 && e.target.value) {
let value = this.input.value; let value = this.input.value;
@ -175,21 +178,28 @@ export class Choices {
handleEnterKey(); handleEnterKey();
} }
// If backspace or delete key is pressed and the input has no value
if ((e.keyCode === 8 || e.keyCode === 46) && !e.target.value) { if ((e.keyCode === 8 || e.keyCode === 46) && !e.target.value) {
let handleBackspaceKey = () => { let handleBackspaceKey = () => {
let currentListItems = this.list.querySelectorAll('.choices__item'); if(this.options.removeItems) {
let lastItem = currentListItems[currentListItems.length - 1]; let currentListItems = this.list.querySelectorAll('.choices__item');
let selectedItems = this.list.querySelectorAll('.is-selected');
let lastItem = currentListItems[currentListItems.length - 1];
if(lastItem) { if(lastItem) {
lastItem.classList.add('is-selected'); lastItem.classList.add('is-selected');
} }
if(this.options.editItems && lastItem) { // If editing the last item is allowed and there is a last item and
this.input.value = lastItem.innerHTML; // there are not other selected items (minus the last item), we can edit
this.removeItem(lastItem); // the item value. Otherwise if we can remove items, remove all items
} else { if(this.options.editItems && lastItem && selectedItems.length <= 1) {
this.removeAll(currentListItems); this.input.value = lastItem.innerHTML;
this.removeItem(lastItem);
} else {
this.removeAll(currentListItems);
}
} }
}; };