我想在选择框中选择不同的值时刷新表值。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.
HTML 代码
<select id="destinations">
<option value=""></option>
</select>
<table class="table table-hover" id="class">
<thead>
<tr>
<th>S.No</th>
<th>Date & Time</th>
<th>Status</th>
<th>Served Business</th>
<th>Total Amount</th>
<th>Parking Rate</th>
<th>Tip</th>
<th>Promo Code</th>
<th>Promo Discount</th>
</tr>
</thead>
</table>
<div id="label_CarsParked" class="number"></div>
<div id="label_RevenueWithTip" class="number"></div>
<div id="label_Revenue" class="number"></div>
脚本
$(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('<option value="' + v.ValetLotId + '">' + v.BusinessName + ', ' + v.Address + '</option>');
});
});
});
$('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 = "<tr>" + "<td>" + f.Date + "</td>" + "<td>" + f.Status + "</td>" + "<td> " + f.BusinessName + "</td>" + "<td>" + f.TotalAmount + "</td>" + "<td>" + f.ParkingRate + "</td>" + "<td>" + f.Tip + "</td>" + "<td>" + f.PromoCode + "</td>" + "<td>" + f.PromoDiscount + "</td>" + "</tr>"
$(tblRow).appendTo("#class tbody");
});
});
});
这是我的引导日期选择器脚本
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();
}
在上面的 getJson 方法中，我将“start_date”“end_date”设置为静态值。我的问题是如何动态设置“start_date”“end_date”中的日期选择器值。我怎么能得到这个。请任何人举个jsfiddle的例子。