Question

我想在选择框中选择不同的值时刷新表值。我的问题是当选择选择框值表完全加载数据然后我选择另一个值表加载而不刷新现有值。 Ma脚本是jquery并使用getjson方法获取数据。

HTML代码

<select id="destinations"  >
    <option value=""></option>
</select>
<table id= "class" class="table table-hover">
    <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>
    <tbody>                         
    </tbody>
</table>

脚本

$(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");
        });
    });
});

Answer 1

检查我完成的JSFIDDLE：

http://jsfiddle.net/G5Cb8/3/

你必须在选择更改时清除表格：

    $('table#class tbody').html('');

如何在选择框中选择不同的值时刷新表值

1 个答案: