fixed dbl-fillOptions in bz-select

This commit is contained in:
STEINNI
2025-10-20 16:34:01 +00:00
parent 2042a498ec
commit 0af3d0f8ff

View File

@@ -40,6 +40,7 @@ class Buildoz extends HTMLElement {
class BZselect extends Buildoz { class BZselect extends Buildoz {
#value #value
#fillFromMarkup = true
constructor(){ constructor(){
super() super()
@@ -58,10 +59,13 @@ class BZselect extends Buildoz {
this.prepend(this.button) this.prepend(this.button)
this.button.addEventListener('click', this.toggle.bind(this)) this.button.addEventListener('click', this.toggle.bind(this))
this.options = this.querySelectorAll('option') this.options = this.querySelectorAll('option')
if(this.#fillFromMarkup){ //can only do it once and only if fillOptions was not already called !!
for(const opt of this.options){ for(const opt of this.options){
opt.addEventListener('click', this.onClick.bind(this)) opt.addEventListener('click', this.onClick.bind(this))
if(opt.getAttribute('selected') !== null) this.onOption(opt.value, true) if(opt.getAttribute('selected') !== null) this.onOption(opt.value, true)
} }
this.#fillFromMarkup = false
}
} }
// static get observedAttributes(){ // Only if you want actions on attr change // static get observedAttributes(){ // Only if you want actions on attr change
@@ -108,17 +112,20 @@ class BZselect extends Buildoz {
} }
addOption(value, markup){ addOption(value, markup){
// Caution: you can count on connectedCallback to have run already, because one might fill before adding to the DOM
const opt = document.createElement('option') const opt = document.createElement('option')
opt.setAttribute('value', value) opt.setAttribute('value', value)
opt.innerHTML = markup opt.innerHTML = markup
opt.addEventListener('click',this.onClick.bind(this)) opt.addEventListener('click',this.onClick.bind(this))
this.append(opt) this.append(opt)
this.options = this.querySelectorAll('option') this.options = this.querySelectorAll('option')
this.#fillFromMarkup = false
} }
fillOptions(opts, erase = true){ fillOptions(opts, erase = true){
// Caution: you can count on connectedCallback to have run already, because one might fill before adding to the DOM
if(erase){ if(erase){
//this.options = this.querySelectorAll('option') this.options = this.querySelectorAll('option')
this.options.forEach(node => { node.remove() }) this.options.forEach(node => { node.remove() })
this.options = this.querySelectorAll('option') this.options = this.querySelectorAll('option')
this.onOption('', true) // unselect last this.onOption('', true) // unselect last