Autofocusing a text component on load?

Hello, I'm adding to my page a Text-component that I will use as a search field for the DataGrid present in that page.

I would like that as soon as the page loads, the focus will go on this text-component right away!

Usually in an angular project, I would just add "autofocus" to a input tag, but here I'm at loss on what to do, any ideas?

Hi @ava_pmi,

You can execute the following code on Page Load:

setTimeout(()=>document.getElementById('UserName').focus(), 500)


thank you for the answer!
I will try this!

Can I ask you one more thing, I'm implementing the global search box for a DataGrid following your guide:

but as DataSource Method I'm using API Calls, is it possible to use "$filter" on them, as it doesnt seem to work!

I added a parameter in the Invoke, called it "$filter", and as value: "contains(displayName, '${this.textbox0.value}')" but this doesn't work, it doesn't filter the result

This parameter is applicable for OData service only. The approach will work if you are using OData data source or some of the SQL database data sources - for plain REST you will need to implement your own filtering.

ok that make sense, is there any example around of a good way on how to implement a filter?
Would creating a custom method in the non-generated .TS file, where I pass the Result object of the API call, and the Filter value, do the filtering inside the method, and return the filtered Result object, be a good approach?
Thank you for the support

If you have REST data source added to Radzen application you can simply call your data source method and provide the parameter to the same value as in our example.