Fire submit event/call a function when user stops typing in input field in sapui5

[#1]

Hello,

I have a requirement where user is typing in the input but length of the field is not fixed. I want to perform something when user stops typing. User is not pressing or doing anything. how can I call a function when user stops typing.

looking forward for suggestions.

Thanks,

Vanshika

[Marian_Zeis · Accepted solution]

See here for a example of delayed input.
It waits for 500 miliseconds and resets when the user types, so basically wait till the user stops typing.

	public liveSearch(event: Event): void {
		const value = (event.getParameter("value") as string).trim();
		// delay search input
		if (this.timerId) {
			clearTimeout(this.timerId);
		}
		this.timerId = setTimeout(() => {
			this.liveSearchHandler(value);
		}, 500) as unknown as number;
	}

	public liveSearchHandler(value: string): void {
		// const value = event.getParameter("value").trim();
		this.getView().getModel("settings").setProperty("/search", value);
		this.applySearch();
	}

Hereis the input field:

            <Input
              placeholder="{i18n>app_view_search_placeholder}"
              class="sapUiMediumMarginTopBottom"
              id="multiInput"
              width="100%"
              liveChange=".liveSearch"
              showSuggestion="false"
              showValueHelp="false"
              showTableSuggestionValueHelp="false"
              value="{settings>/search}"
              visible="{= ${settings>/route} !== 'RouteObjectView'}"
            >

[Marian_Zeis · Accepted solution]

Hi vanshikachaturvedi3312 ,
please try to troubleshoot before you post your question here.
You rewrote the code i gave you.

Why did you use "window"? That just overrides the function and executes it immediately.

Try this:

this.timerId = setTimeout(function() {
   this.liveSearchHandler(value);
}, 1000);

[2109_v · Accepted solution]

Hello Marian Zeis,

Thanks for your solution. It is working as expected.

clearTimeout(this.timerId);
			this.timerId = setTimeout(function () {
				this.liveSearchHandler(value);
			}.bind(this), 1000);