title: form input date picker not showing on ajax page
body: <p>I've been trying to use the jquery datepicker on my ajax page but it fails to load.Am developing a web app on laravel framework and ajax but when i try to use the jquery datepicker it only works if the form is on my master page.but once i click on a link which loads a new page into a div the datepicker doesnt work there.And my console isnt throwing any errors.Any idea what i might bee doing wrong.</p>
  
  <p>Here is the example on jquery website that i followed.</p>
  
  <pre><code>&lt;!doctype html&gt;
  &lt;html lang="en"&gt;
  &lt;head&gt;
  &lt;meta charset="utf-8"&gt;
  &lt;title&gt;jQuery UI Datepicker - Default functionality&lt;/title&gt;
  &lt;link rel="stylesheet" href="//code.jquery.com/ui/1.11.1/themes/smoothness/jquery-ui.css"&gt;
  &lt;script src="//code.jquery.com/jquery-1.10.2.js"&gt;&lt;/script&gt;
  &lt;script src="//code.jquery.com/ui/1.11.1/jquery-ui.js"&gt;&lt;/script&gt;
  &lt;link rel="stylesheet" href="/resources/demos/style.css"&gt;
  &lt;script&gt;
  $(function() {
  $( "#datepicker" ).datepicker();
  });
  &lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
  &lt;p&gt;Date: &lt;input type="text" id="datepicker"&gt;&lt;/p&gt;
  &lt;/body&gt;
  &lt;/html&gt;  
  </code></pre>
  
  <p>Here is my ajax call</p>
  
  <pre><code>function makerequest(serverPage, objID) {
  var obj = document.getElementById(objID);
  obj.innerHTML = '&lt;b&gt;Loading....&lt;/b&gt;';
  xmlhttp.open("GET", serverPage);
  xmlhttp.onreadystatechange = function() {
  if (xmlhttp.readyState == 4 &amp;&amp; xmlhttp.status == 200) {
  obj.innerHTML = xmlhttp.responseText;
  }
  }
  xmlhttp.send(null);
  }
  </code></pre>
  
  <p>page am trying to load into div</p>
  
  <pre><code>     &lt;form method="POST" action="{{URL::route('applicant.store')}}" class="user form-horizontal" enctype="multipart/form-data"&gt;
          &lt;br&gt;
          &lt;input type="text" id="datepicker"&gt;
          &lt;h4 class="text-center"&gt;ENROLLEE REGISTRATION FORM&lt;/h4&gt;
      &lt;!--div to contain ajax passport--&gt;
         &lt;!-- &lt;div id="passport" class="text-center" style="border:1px solid black;height:120px;width:120px;color:silver"&gt;&lt;/div&gt; --&gt;
  
         &lt;!--surname and othernames--&gt;
          &lt;div class="form-group"&gt;
              &lt;div class="col-sm-1 col-md-offset-"&gt;        
              &lt;label for="name"&gt;Surname&lt;/label&gt;        
              &lt;/div&gt;
              &lt;div class="col-sm-4"&gt;
              &lt;input type="text" name="surname" required value="{{Input::old('surname')}}" class="form-control"&gt;
  
              &lt;/div&gt;
              &lt;div class="col-sm-1 col-md-offset-"&gt;        
              &lt;label for="name"&gt;Other Names&lt;/label&gt;        
              &lt;/div&gt;
              &lt;div class="col-sm-4"&gt;
              &lt;input type="text" name="othernames" required value="{{Input::old('othernames')}}" class="form-control"&gt;
  
              &lt;/div&gt;
          &lt;/div&gt;
  
            &lt;div class="form-group"&gt;
          &lt;div class="col-sm-2 col-md-offset-"&gt;        
              &lt;label for="name"&gt;Upload Passport&lt;/label&gt;        
              &lt;/div&gt;
          &lt;div class="col-sm-3"&gt;
         &lt;input type="file" name="passport" class="form-control"/&gt;
      &lt;/div&gt;
      &lt;/div&gt;
  
      &lt;div class="col-sm-2 col-md-offset-"&gt; 
          &lt;div&gt;       
              &lt;label for="form_no"&gt;Form NO.&lt;/label&gt;        
              &lt;/div&gt;
              &lt;div class="col-sm-1"&gt;
              &lt;input type="text" name="form_no" value="{{Input::old('form_no')}}" class="form-control" required&gt;
              &lt;/div&gt;
  
              &lt;div class="col-sm-2 col-md-offset-"&gt;        
              &lt;label for="tell_no"&gt;Teller/Reciept NO.&lt;/label&gt;        
              &lt;/div&gt;
              &lt;div class="col-sm-2"&gt;
              &lt;input type="text" name="tell_no" value="{{Input::old('tell_no')}}" class="form-control" required&gt;
              &lt;/div&gt;
  
              &lt;div class="col-sm-1 col-md-offset-"&gt;        
              &lt;label for="amt_paid"&gt;Amount Paid&lt;/label&gt;        
              &lt;/div&gt;
              &lt;div class="col-sm-1"&gt;
              &lt;input type="text" name="amt_paid" value="{{Input::old('amt_paid')}}" class="form-control" required&gt;
              &lt;/div&gt;
  
       &lt;/div&gt;   
  
           &lt;div class="form-group"&gt;
              &lt;div class="col-sm-1 col-md-offset-"&gt;                                 
       &lt;button type="submit" class="btn btn-success"&gt;&lt;span class="glyphicon glyphicon-plus"&gt;&lt;/span&gt;&amp;nbsp;Submit Application Form&lt;/button&gt;
  
          &lt;/div&gt;
  &lt;/form&gt;
          &lt;/div&gt;
  
      &lt;/div&gt;
      &lt;/form&gt;
      &lt;/div&gt;
      &lt;/div&gt;
      &lt;/div&gt;
          &lt;/div&gt;
  
  &lt;script&gt;
  $('document').ready(function(){
  $( "#datepicker" ).datepicker();
  $( "#regpicker" ).datepicker();
  });
  &lt;/script&gt;
  </code></pre>
  
  <p>Any help would be appreciated thanks</p>