For anyone in the future... The trick would be to add a regular drag and drop text field through the weebly interface.. then add the datepicker field as you did.

<link rel="stylesheet" href="//code.jquery.com/ui/1.11.2/themes/smoothness/jquery-ui.css">
  <script src="//code.jquery.com/jquery-1.10.2.js"></script>
  <script src="//code.jquery.com/ui/1.11.2/jquery-ui.js"></script>
  <script>
  $(function() {
    $( "#datepicker" ).datepicker({
    minDate: new Date(),    // prevent selection of date older than today
    autoSize: true,         // automatically resize the input field
    dateFormat: 'DD, d MM yy',  // Date Format used
    firstDay: 1 // Start with Monday
    });
  });
  </script> 
<p>Please select a Date</p>
<input id="datepicker" class="wsite-form-input wsite-input" type="text" name="datepicker" />

Then you would need to use jquery to copy the value of the datepicker field into the regular text field whenever someone selects a date. That will save the date into the backend. Final code block below -- be sure to swap out the id used for the id of the text field we added before adding this code block. (see comments in code)

<link rel="stylesheet" href="//code.jquery.com/ui/1.11.2/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.2/jquery-ui.js"></script>
<script>
$(function() {
$( "#datepicker" ).datepicker({
minDate: new Date(), // prevent selection of date older than today
autoSize: true, // automatically resize the input field
dateFormat: 'DD, d MM yy', // Date Format used
firstDay: 1, // Start with Monday
onSelect: function(dateText, inst) {
var date = $(this).val();
$("#input-30571982367218956").val(date); //use the id of the text field we added through the weebly interface.
}
});
});

</script>
<p>Please select a Date</p>
<input id="datepicker" class="wsite-form-input wsite-input" type="text" name="datepicker" />
<br>
<br>
<style>
#input-305719823672189561 {
display:none !important;
}
</style>

hope that helps!