60 lines
1.4 KiB
JavaScript
60 lines
1.4 KiB
JavaScript
export class FieldInputItem {
|
|
container = null;
|
|
removeBtn = null;
|
|
|
|
constructor(input, parentElem) {
|
|
this.input = input;
|
|
this.field = input.field;
|
|
this.id = input.id + (input.field.allowMultiple ? "-" + Math.random().toString().slice(2, 5) : "");
|
|
|
|
this.appendHtml(parentElem);
|
|
}
|
|
|
|
appendHtml(parent) {
|
|
const container = document.createElement("div");
|
|
container.className = "input-container";
|
|
|
|
if (this.field.allowMultiple) {
|
|
const wrapper = document.createElement("div");
|
|
wrapper.innerHTML = this.field.getInputHtml(this.id);
|
|
container.appendChild(wrapper);
|
|
|
|
const removeBtn = document.createElement("button");
|
|
removeBtn.type = "button";
|
|
removeBtn.className = "text-button";
|
|
removeBtn.innerHTML = "× Remove";
|
|
removeBtn.onclick = () => this.input.removeItem(this.id);
|
|
container.appendChild(removeBtn);
|
|
|
|
this.removeBtn = removeBtn;
|
|
} else {
|
|
container.innerHTML = this.field.getInputHtml(this.id);
|
|
}
|
|
|
|
parent.appendChild(container);
|
|
this.container = container;
|
|
}
|
|
|
|
update() {
|
|
if (this.removeBtn) {
|
|
this.removeBtn.style.display = this.input.items.length > 1 ? "inline-block" : "none";
|
|
}
|
|
}
|
|
|
|
remove() {
|
|
this.container.remove();
|
|
}
|
|
|
|
isValid() {
|
|
return this.field.isValidInput(this.id);
|
|
}
|
|
|
|
getValue() {
|
|
return this.field.getInputValue(this.id);
|
|
}
|
|
|
|
toString() {
|
|
return this.field.inputToString(this.id);
|
|
}
|
|
}
|