0

I've added some basic tooltips to the jquery datepicker plugin but after I change the month the events are no longer bound to their selectors. How can I rebind these events on month change?

A cut down version of what I'm working with is below.

<script>

$(function() {
    $("#scene").datepicker();
    var evtd = { 
        March312013: {title: "Ladies Night"}, 
        March302013: {title: "Lilly Allen Tribute Band"}
    }

    $(".ui-state-default").on("mouseenter", function(e) {
        var month = $(".ui-datepicker-month").text();
        var year = $(".ui-datepicker-year").text();
        var day = $(this).text();
        ix = month + day + year;
        if(typeof(evtd[ix])!="undefined")
        {
            var html = '<h5>'+evtd[ix]["title"]+'</h5>';
            var eleft = $(this).position().left;
            var etop = $(this).position().top;
            $("#tt").html(html).css({
                left:  Math.max(eleft-($(this).width()/2),0),
                top:   Math.max(etop+$(this).height()+7,0)
            }).show();
        }
    }).mouseleave(function(){
        $("#tt").hide();
    });
});

</script>
<style>
.nm{
    margin:0;
}

#tt{
    max-width:250px;
    position:absolute;
    border:1px solid black;
    background-color:#E9EAEE;
    padding:8px;
    display:none;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
    font-family:Trebuchet MS,Tahoma,Verdana,Arial,sans-serif;
}
</style>

<div id="scene">MobeScene Events</div>
<div id="tt"></div>
1
  • try to write your function in $(document).ready()..
    – Pratik
    Mar 4, 2013 at 13:36

1 Answer 1

1

Try to bind your event like this :

$(document).on("mouseenter",".ui-state-default",function(e){
   //Your stuff
});

See this answer for further explications!

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.