jquery ui dialog with large table dataset

HTML

<link rel="stylesheet" href="http://code.jquery.com/ui/1.8.21/themes/base/jquery-ui.css">
<link rel="stylesheet" href="http://static.jquery.com/ui/css/demo-docs-theme/ui.theme.css">
<div class="wrapper">
<div class="datepicker-wrapper">
    <label for="dp-1">datepicker 1</label>
    <input type="text" class="datepickers" id="dp-1" /></div>
<div class="datepicker-wrapper">
    <label for="dp-2">datepicker 2</label>    
    <input type="text" class="datepickers" id="dp-2" /></div>
<div class="datepicker-wrapper">
        <label for="dp-3">datepicker 3</label>
    <input type="text" class="datepickers" id="dp-3" /></div>
<div class="datepicker-wrapper">
        <label for="to">datepicker "to"</label>
    <input type="text" class="datepickers" id="to" /></div>
<div class="datepicker-wrapper">
        <label for="from">datepicker "from"</label>
    <input type="text" class="datepickers" id="from" /></div>
</div>

CSS

.wrapper{margin:10px;}

.datepicker-wrapper{margin:20px 5px;}

JavaScript

$(document).ready(function () { 
   $('.datepickers').datepicker({
        dateFormat: "yy-mm-dd",
        showButtonPanel: true,
        changeMonth: true,
        changeYear: true,
        showOtherMonths: true,
        selectOtherMonths: true,
        showWeek: true,
        onSelect: function(dateText, inst) {
           if(inst.id === 'to'){
             $('.datepickers')
             	.filter($('input#from'))
              .datepicker("option", "minDate", dateText);
          }          
        }
   }); 
  
});