select

Better select widgets in vanilla javascript.  https://p.ce9e.org/select/demo/
git clone https://git.ce9e.org/select.git

commit
7ab2c99217818645f1fd479f33afa7e71418d111
parent
c10864a6f8ba04c25e973d80ffdb159c054db618
Author
Tobias Bengfort <tobias.bengfort@posteo.de>
Date
2025-05-02 08:59
refactor: change some function names

Diffstat

M select.js 20 ++++++++++----------

1 files changed, 10 insertions, 10 deletions


diff --git a/select.js b/select.js

@@ -17,7 +17,7 @@ export class Select {
   17    17 		original.hidden = true;
   18    18 		original.before(this.wrapper);
   19    19 
   20    -1 		this.updateValue();
   -1    20 		this.updateInput();
   21    21 	}
   22    22 
   23    23 	createElements() {
@@ -77,7 +77,7 @@ export class Select {
   77    77 		return s.toLowerCase().indexOf(q) !== -1;
   78    78 	}
   79    79 
   80    -1 	update() {
   -1    80 	updateDropdown() {
   81    81 		var options = this.dropdown.querySelectorAll('[role="option"]');
   82    82 		if (this.focus !== -1 && options.length) {
   83    83 			Array.from(options).forEach((li, i) => {
@@ -95,13 +95,13 @@ export class Select {
   95    95 		}
   96    96 	}
   97    97 
   98    -1 	updateValue() {
   -1    98 	updateInput() {
   99    99 		if (this.original.multiple) {
  100   100 			this.input.value = '';
  101   101 			this.inputDirty = false;
  102   102 			this.updateValidity();
  103   103 			this.values.update(this.original, () => {
  104    -1 				this.updateValue();
   -1   104 				this.updateInput();
  105   105 				this.input.focus();
  106   106 			});
  107   107 		} else {
@@ -166,21 +166,21 @@ export class Select {
  166   166 				}
  167   167 			}
  168   168 		});
  169    -1 		this.update();
   -1   169 		this.updateDropdown();
  170   170 	}
  171   171 
  172   172 	close() {
  173   173 		this.focus = -1;
  174   174 		this.dropdown.innerHTML = '';
  175   175 		this.indexMap = [];
  176    -1 		this.update();
   -1   176 		this.updateDropdown();
  177   177 	}
  178   178 
  179   179 	moveFocus(k) {
  180   180 		this.focus += k;
  181   181 		this.focus = Math.max(this.focus, 0);
  182   182 		this.focus = Math.min(this.focus, this.indexMap.length - 1);
  183    -1 		this.update();
   -1   183 		this.updateDropdown();
  184   184 	}
  185   185 
  186   186 	setValue(i, toggle) {
@@ -191,8 +191,8 @@ export class Select {
  191   191 		}
  192   192 		this.original.dispatchEvent(new Event('change'));
  193   193 		this.close();
  194    -1 		this.update();
  195    -1 		this.updateValue();
   -1   194 		this.updateDropdown();
   -1   195 		this.updateInput();
  196   196 	}
  197   197 
  198   198 	onkeydown(event) {
@@ -230,7 +230,7 @@ export class Select {
  230   230 			if (n) {
  231   231 				var op = this.original.selectedOptions[n - 1];
  232   232 				op.selected = false;
  233    -1 				this.updateValue();
   -1   233 				this.updateInput();
  234   234 				this.input.value = op.label;
  235   235 				this.input.dispatchEvent(new Event('input'));
  236   236 			}