Hello-World
Hello-World

Reputation: 9555

Telerik - add custom change event to date picker with jquery

I have an ASP.Net MasterPage, with a custom control ("uc1') that has a rad date picker in it ( "myCal')

I want to add a jquery change event on my aspx page but the below code wont work

$(document).ready(function(){

 $('#myCal').change(function(){
        alert('Found');
 });

});

Thanks for the help

Upvotes: 0

Views: 2706

Answers (2)

Obsidian Phoenix
Obsidian Phoenix

Reputation: 4155

You are attempting to bind using #MyCal, but the control doesn't render to the page with that name. ASP.Net changes the name during render - so you need to use the Client ID. However even if you were to use that, your code as is would just bind the Change event to the outlying wrapper component - Usually a span/div - not the textbox itself.

First up, why are you trying to do it on jQuery? You can just use the ClientEvents-OnDateSelected property on the RadDatePicker to raise a client event when they select/enter a date (it doesn't raise until they move out of the field though).

<script type="text/javascript">
    function clientEvent(sender, args)
    {
        alert("Date Changed (raised via OnDateSelected)");
    }
</script>
<telerik:RadDatePicker runat="server" ID="pick1" ClientEvents-OnDateSelected="clientEvent" />

Alternatively, if you really do want to do it via jQuery, you can do the below:

<script type="text/javascript">
    $(document).ready(function ()
    {
        var picker = $find("<%=pick2.ClientID %>");
        var box = picker.get_textBox();

        $(box).change(function ()
        {
            alert('Found');
        });

    });
</script>
<telerik:RadDatePicker runat="server" ID="pick2"  />

Upvotes: 3

Farhan
Farhan

Reputation: 752

Your code seems to be fine, after your page is loaded just inspect the field and check that ID is 'mycal' and that you dont have multiple fields with same ID.

Upvotes: 0

Related Questions