How to catch a LostFocus event in client-side code?

Question

This is really a dumb newbie question, but I am still learning the ropes of ASP.NET, and I couldn't work this one out by myself... < blush>

I am working with a 3rd party control (Telerik RadTimePicker). Somebody else designed the form, and I just want to catch an event on the client side when the control loses focus so I can set the value of another control based on the value of this one. But I can't find any event that I can use to do this!

Here's the existing code:

<telerik:RadTimePicker ID="timeStart" runat="server">
  <TimeView runat="server" OnClientTimeSelected="OnClientTimeSelected">
  </TimeView>
</telerik:RadTimePicker>

As you can see, there's already javascript code in place if the user drops down the time selector and clicks on a time to select it - but there's nothing to handle the case where the user types in the time and then tabs off the control.

How do I do it?

Answer 1

onBlur is the event for lost focus - here's a reference.

Edit: For the RadTimePicker you'll need to know the ID of the underlying HTML control to attach a handler to - i.e. the input textbox. You can find this by viewing the source of the rendered page or using something like Firebug.

Once you've got the ID, you can attach an event handler using javascript

e.g in JQuery

$("id_of_textbox").bind("blur", function(e){
      //Code in here
    });

Answer 2

Because the RadTimePicker effectively is made up of the RadDateInput you can use all of the events that come with that:

http://www.telerik.com/help/aspnet-ajax/input%5Fclientsideonblur.html

So your code would look like this:

<telerik:RadTimePicker ID="timeStart" runat="server">
            <TimeView ID="TimeView1" runat="server" OnClientTimeSelected="OnClientTimeSelected">
            </TimeView>
            <DateInput ClientEvents-OnBlur="timeStart_onBlur">
            </DateInput>
</telerik:RadTimePicker>