Focus input field when the create budget window has opened
This commit is contained in:
parent
841a0506e3
commit
a34558a6da
2 changed files with 11 additions and 0 deletions
|
@ -40,6 +40,11 @@ class BudgetCreateComponent extends LitElement {
|
|||
`
|
||||
}
|
||||
|
||||
firstUpdated() {
|
||||
const nameInputEl = <InputField>this.shadowRoot.getElementById('name')
|
||||
nameInputEl.focusInput()
|
||||
}
|
||||
|
||||
updated(changedProperties: Map<string | number | symbol, any>) {
|
||||
// If error was turned on, turn it off after a moment
|
||||
if (changedProperties.has('hasError')) {
|
||||
|
|
|
@ -56,6 +56,12 @@ export class InputField extends LitElement {
|
|||
(<HTMLInputElement>this.shadowRoot.getElementById(this.inputId)).value = ''
|
||||
}
|
||||
|
||||
async focusInput() {
|
||||
await this.updateComplete
|
||||
const el = <HTMLInputElement>this.shadowRoot.getElementById(this.inputId)
|
||||
el.focus()
|
||||
}
|
||||
|
||||
render() {
|
||||
return html`
|
||||
<label for="${this.inputId}">${this.label}</label>
|
||||
|
|
Reference in a new issue