Binding jQuery UI plugin after $.load
        Posted  
        
            by TomWilsonFL
        on Stack Overflow
        
        See other posts from Stack Overflow
        
            or by TomWilsonFL
        
        
        
        Published on 2010-05-02T02:49:59Z
        Indexed on 
            2010/05/02
            2:57 UTC
        
        
        Read the original article
        Hit count: 378
        
I have a function that attaches the jQuery UI DatePicker (with my options) to a passed jQuery object:
function bindDatepicker($obj)
{
  if ($obj == null) $obj = $("input.date");
  $obj.datepicker(
    { 
      appendText: '(yyyy-mm-dd)',
      autoSize: true,
      changeMonth: true, 
      changeYear: true, 
      closeText: 'Done',
      dateFormat: 'yy-mm-dd',
      defaultDate: '+1m', 
      minDate: +1, 
      numberOfMonths: 2
    }
  );
}
I call this at the beginning of every page to bind it to input elements:
$(function() {
  bindDatepicker($("input.date"));
});
This works fine. My problem comes in when I load form elements using $.load(). I cannot attach the DatePicker to any of the loaded elements. For example:
$("#id").load("urlToLoad", function() {
    bindDatepicker($("input.date"));
});
Loads the form elements into a div just fine, but will not attach the DatePicker.
Why is this? I am stumped. :(
Thanks, Tom
© Stack Overflow or respective owner