title: jQuery date picker not persistant after AJAX
body: <p>So I'm using the jQuery date picker, and it works well. I am using AJAX to go and get some content, obviously when this new content is applied the bind is lost, I <a href="https://stackoverflow.com/questions/2773573/jquery-ajaxed-content-losing-its-bind">learnt about this last week</a> and discovered about the <code>.live()</code> method.</p>
  
  <p>But how do I apply that to my date picker? Because this isn't an event therefore <code>.live()</code> won't be able to help... right?</p>
  
  <p>This is the code I'm using to bind the date picker to my input:</p>
  
  <pre><code>$(".datefield").datepicker({showAnim:'fadeIn',dateFormat:'dd/mm/yy',changeMonth:true,changeYear:true});
  </code></pre>
  
  <p>I do not want to call this metho everytime my AJAX fires, as I want to keep that as generic as possible.</p>
  
  <p>Cheers :-)</p>
  
  <p><strong>EDIT</strong></p>
  
  <p>As @nick requested, below is my wrapper function got the <code>ajax()</code> method:</p>
  
  <pre><code>var ajax_count = 0;
  function getElementContents(options) {
      if(options.type===null) {
           options.type="GET";
      }
  
      if(options.data===null) {
          options.data={};
      }
  
      if(options.url===null) {
          options.url='/';
      }
  
      if(options.cache===null) {
          options.cace=false;
      }
  
      if(options.highlight===null || options.highlight===true) {
          options.highlight=true;
      } else {
          options.highlight=false;
      }
  
      $.ajax({
          type: options.type,
          url: options.url,
          data: options.data,
          beforeSend: function() {
              /* if this is the first ajax call, block the screen */
              if(++ajax_count==1) {
                  $.blockUI({message:'Loading data, please wait'});
              } 
          },
          success: function(responseText) {
              /* we want to perform different methods of assignment depending on the element type */
  
              if($(options.target).is("input")) {
                  $(options.target).val(responseText);
              } else {
                  $(options.target).html(responseText);
              }
              /* fire change, fire highlight effect... only id highlight==true */
              if(options.highlight===true) {
                  $(options.target).trigger("change").effect("highlight",{},2000);
              }
          },
          complete: function () {
              /* if all ajax requests have completed, unblock screen */
              if(--ajax_count===0) {
                  $.unblockUI();
              }
          },
          cache: options.cache,
          dataType: "html"
      });
  }
  </code></pre>
  
  <p>What about this solution, I have a rules.js which include all my initial bindings with the elements, if I were to put these in a function, then call that function on the success callback of the ajax method, that way I wouldn't be repeating code...</p>
  
  <p>Hmmm, thoughts please :D</p>