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: 318

Filed under:
|
|

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

Related posts about jQuery

Related posts about JavaScript