forked from MapComplete/MapComplete
Add search, a few flow updates
This commit is contained in:
parent
7b9ab77bda
commit
c87c014045
14 changed files with 345 additions and 17 deletions
46
UI/Base/TextField.ts
Normal file
46
UI/Base/TextField.ts
Normal file
|
@ -0,0 +1,46 @@
|
|||
import {UIElement} from "../UIElement";
|
||||
import {UIEventSource} from "../UIEventSource";
|
||||
|
||||
|
||||
export class TextField extends UIElement {
|
||||
|
||||
public value = new UIEventSource("");
|
||||
/**
|
||||
* Pings and has the value data
|
||||
*/
|
||||
public enterPressed = new UIEventSource<string>(undefined);
|
||||
private _placeholder: UIEventSource<string>;
|
||||
|
||||
constructor(placeholder : UIEventSource<string>) {
|
||||
super(placeholder);
|
||||
this._placeholder = placeholder;
|
||||
}
|
||||
|
||||
protected InnerRender(): string {
|
||||
return "<form onSubmit='return false' class='form-text-field'>" +
|
||||
"<input type='text' placeholder='"+this._placeholder.data+"' id='text-" + this.id + "'>" +
|
||||
"</form>";
|
||||
}
|
||||
|
||||
InnerUpdate(htmlElement: HTMLElement) {
|
||||
super.InnerUpdate(htmlElement);
|
||||
const field = document.getElementById('text-' + this.id);
|
||||
const self = this;
|
||||
field.oninput = () => {
|
||||
self.value.setData(field.value);
|
||||
};
|
||||
|
||||
field.addEventListener("keyup", function (event) {
|
||||
if (event.key === "Enter") {
|
||||
self.enterPressed.setData(field.value);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
Clear() {
|
||||
const field = document.getElementById('text-' + this.id);
|
||||
if (field !== undefined) {
|
||||
field.value = "";
|
||||
}
|
||||
}
|
||||
}
|
Loading…
Add table
Add a link
Reference in a new issue