One of the nice things about attending conferences like TechEd is all of the direct feedback you get from Telerik "fans" (people that use the RadControls everyday and love them). These fans love to use the RadControls and they also love to push the controls to their limits. That often leads to some interesting questions, such as this one I was presented with at the Telerik booth:
"Is it possible to delay the RadCombobox autocomplete callback until a certain number of characters have been typed? Or is it possible to delay the callback so that it doesn't start until users stop typing a number of characters?"
The answer to both questions is a resounding 'yes'. Today we'll take a quick look at the RadCombobox client-side API to see how easy it is to add some custom handling of the autocomplete Ajax callbacks.
Approach 1: ItemRequestTimeout Property
One of the easiest ways to solve the problem of "too many" Ajax callbacks being generated by RadCombobox's AutoComplete features is to adjust the ItemRequestTimeout property. This simple property sets in milliseconds the amount of time that RadCombobox will wait after the last key is pressed before sending an Ajax request to the server. If another key is pressed before the timeout elapses, the timeout is shifted and no extra callbacks are made to the server.
The default value for this property is 300ms, but you can easily change it like this:
Approach 2: Delaying Callbacks Manually
- type: string, type of keypress (usually "keydown")
- charCode: int
- keyCode: int
- ctrlKey: bool, indicates if key pressed was control key
- altKey: bool, indicates if key pressed was alt key
- shiftKey: bool
- metaKey: bool
- isChar: bool
Fig1: Handle KeyPress event and setup timer
Fig2: Helper functions to clear timer, manually request items, and add some debugging info to the screen
And here is how we'll configure RadCombobox to use these client-side events:
This will now achieve results very similar to approach 1, but the process exposes you to a number of helpful RadCombobox client-side features.
Approach 3: Creating Minimum Characters Delay
And we configure our RadCombobox like this:
Now callbacks will only be fired after at least 3 characters have been entered in our Combobox. If used in conjunction with approach 1 or approach 2, you can highly tune your RadCombobox load on demand behavior to match the behavior of your users and reduce callbacks to your server.
Download supporting code for this post