title: How to refresh table data while select different value in Select box
body: <p>I want to refresh table value while select different value in Select box. My Issue is when select the select box value Table load the data perfectly then i select the another value Table loaded without refresh the existing value.</p>
  
  <p>HTML Code</p>
  
  <pre><code>&lt;select id="destinations"&gt;
     &lt;option value=""&gt;&lt;/option&gt;
  &lt;/select&gt;
  
  &lt;table class="table table-hover" id="class"&gt;
  &lt;thead&gt;
  &lt;tr&gt;
  &lt;th&gt;S.No&lt;/th&gt;
  &lt;th&gt;Date &amp;amp; Time&lt;/th&gt;
  &lt;th&gt;Status&lt;/th&gt;
  &lt;th&gt;Served Business&lt;/th&gt;
  &lt;th&gt;Total Amount&lt;/th&gt;
  &lt;th&gt;Parking Rate&lt;/th&gt;
  &lt;th&gt;Tip&lt;/th&gt;
  &lt;th&gt;Promo Code&lt;/th&gt;
  &lt;th&gt;Promo Discount&lt;/th&gt;
  &lt;/tr&gt;
  &lt;/thead&gt;
  &lt;/table&gt;
  &lt;div id="label_CarsParked" class="number"&gt;&lt;/div&gt;
  &lt;div id="label_RevenueWithTip" class="number"&gt;&lt;/div&gt;
  &lt;div id="label_Revenue" class="number"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>Script</p>
  
  <pre><code>$(document).ready(function() {
  $.getJSON('http://api.valetpayapp.com/phptest/dashboard_fetch_valet_locations.php?callback=?', 'valetgroup_id=valetgroup_52c36a450a002', function(data) {
  $.each(data, function(i, v) {
  $('#destinations').append('&lt;option value="' + v.ValetLotId + '"&gt;' + v.BusinessName + ', ' + v.Address + '&lt;/option&gt;');
  });
  });
  });
  $('select').change(function() {
  var params = {
  valetlot_id: this.value,
  start_date: '2014-01-01',
  end_date: '2014-02-28'
  };
  var str = jQuery.param(params);
          $.getJSON('http://api.valetpayapp.com/phptest/dashboard_fetch_valet_transactions.php?callback=?', str, function(data) {
  $.each(data, function(i, f) {
  var tblRow = "&lt;tr&gt;" + "&lt;td&gt;" + f.Date + "&lt;/td&gt;" + "&lt;td&gt;" + f.Status + "&lt;/td&gt;" + "&lt;td&gt; " + f.BusinessName + "&lt;/td&gt;" + "&lt;td&gt;" + f.TotalAmount + "&lt;/td&gt;" + "&lt;td&gt;" + f.ParkingRate + "&lt;/td&gt;" + "&lt;td&gt;" + f.Tip + "&lt;/td&gt;" + "&lt;td&gt;" + f.PromoCode + "&lt;/td&gt;" + "&lt;td&gt;" + f.PromoDiscount + "&lt;/td&gt;" + "&lt;/tr&gt;"
  $(tblRow).appendTo("#class tbody");
  });
  });
  });
  </code></pre>
  
  <p>This is my bootstrap-datepicker script</p>
  
  <pre><code>function () {
  $('#dashboard-report-range').daterangepicker({
  opens: (App.isRTL() ? 'right' : 'left'),
  startDate: moment().subtract('days', 29),
  endDate: moment(),
  minDate: '01/01/2012',
  maxDate: '12/31/2014',
  dateLimit: {
  days: 60
  },
  showDropdowns: false,
  showWeekNumbers: true,
  timePicker: false,
  timePickerIncrement: 1,
  timePicker12Hour: true,
  ranges: {
  'Today': [moment(), moment()],
  'Yesterday': [moment().subtract('days', 1), moment().subtract('days', 1)],
  'Last 7 Days': [moment().subtract('days', 6), moment()],
  'Last 30 Days': [moment().subtract('days', 29), moment()],
  'This Month': [moment().startOf('month'), moment().endOf('month')],
  'Last Month': [moment().subtract('month', 1).startOf('month'), moment().subtract('month', 1).endOf('month')]
  },
  buttonClasses: ['btn'],
  applyClass: 'blue',
  cancelClass: 'default',
  format: 'MM/DD/YYYY',
  separator: ' to ',
  locale: {
  applyLabel: 'Apply',
  fromLabel: 'From',
  toLabel: 'To',
  customRangeLabel: 'Custom Range',
  daysOfWeek: ['Su', 'Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa'],
  monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'],
  firstDay: 1
  }
  },
  function (start, end) {
  console.log("Callback has been called!");
  $('#dashboard-report-range span').html(start.format('MMMM D, YYYY') + ' - ' + end.format('MMMM D, YYYY'));
  }
  );
  $('#dashboard-report-range span').html(moment().subtract('days', 29).format('MMMM D, YYYY') + ' - ' + moment().format('MMMM D, YYYY'));
  $('#dashboard-report-range').show();
  }
  </code></pre>
  
  <p>In above getJson method am set the "start_date" "end_date" with static value. My question is how to set the datepicker value in "start_date" "end_date" dynamically. how can i get this. please anybody give jsfiddle example.</p>