mysql数据被多次显示

Question

I am trying to fetch details from a mysql table and display it using ajax. I have been successful in showing my records but it seems the records are being displayed in a loop. For ex: Numbers from 1 to 10 are being displayed and as soon as the list of 10 is completed, again numbers from 1 to 10 are being displayed. I cant find where I am going wrong.

Javascript

<script type="text/javascript">
$(function(){
    setInterval(function(){
        $.ajax({
            url: 'details.php',
            success: function(data){
                var response=JSON.parse(data);
                var no=1;

                $(function(){
                    $.each(response, function(i, item){
                        var change = no % 2;
                        if(change === 0){
                            $('<tr>').append(
                                $('<td>').text(item.memo).addClass('table1'),
                                $('<td>').text(item.pid).addClass('table1'),
                                $('<td>').text(item.qty).addClass('table1'),
                                $('<td>').text(item.amt).addClass('table1')
                            ).appendTo('#Table1');
                        }
                        else{
                            $('<tr>').append(
                                $('<td>').text(item.memo).addClass('table2'),
                                $('<td>').text(item.pid).addClass('table2'),
                                $('<td>').text(item.qty).addClass('table2'),
                                $('<td>').text(item.amt).addClass('table2')
                            ).appendTo('#Table1');
                        }
                        no = no+1;
                    });
                });
            }
        });
    }, 1000);
});
</script>

PHP

<?php
include 'connect.php';
$timestamp = "";
$return = array();
$response = "";
$sql = "SELECT * FROM receipts ORDER BY timestamp DESC LIMIT 1";
$result1 = mysqli_query($db, $sql);
if($details = mysqli_fetch_array($result1)){
    $timestamp = $details['timestamp'];
}

$sql = "SELECT * FROM sales WHERE timestamp>'$timestamp'";
$result = mysqli_query($db, $sql);
while($fetch_options=mysqli_fetch_array($result)){
    $return[]=array('memo'=>$fetch_options['memo'], 'pid'=>$fetch_options['pid'], 'qty'=>$fetch_options['qty'], 'amt'=>$fetch_options['amt']);
}
$response = $return;
echo json_encode($response);
?>

HTML

     <table width="300" id="Table1" name="Table1">
     <tr>
        <th width="68" id="wb_uid0"><div class="CustomStyle"><span id="wb_uid1"><strong> Memo</strong></span></div>
        </th>
        <th width="64" id="wb_uid2"><div><span id="wb_uid3"><strong> Product ID</strong></span></div>
        </th>
        <th width="50" id="wb_uid4"><div><span id="wb_uid5"><strong> Qty</strong></span></div>
        </th>
        <th width="88" id="wb_uid6"><div><span id="wb_uid7"><strong> Amount</strong></span></div>
        </th>
     </tr>
     </table>

Answer 1

you can try like this

change JS

<script type="text/javascript">
$(function(){
     setInterval(function(){
    $.ajax({
        url: 'details.php',
        success: function(data){

            $('#Table1').find('#appendRow').remove();
            var response=JSON.parse(data);
            var no=1;

                $.each(response, function(i, item){
                    var change = no % 2;
                    if(change === 0){
                        $('<tr id="appendRow">').append(
                            $('<td>').text(item.memo).addClass('table1'),
                            $('<td>').text(item.pid).addClass('table1'),
                            $('<td>').text(item.qty).addClass('table1'),
                            $('<td>').text(item.amt).addClass('table1')
                        ).appendTo('#Table1');
                    }
                    else{
                        $('<tr id="appendRow">').append(
                            $('<td>').text(item.memo).addClass('table2'),
                            $('<td>').text(item.pid).addClass('table2'),
                            $('<td>').text(item.qty).addClass('table2'),
                            $('<td>').text(item.amt).addClass('table2')
                        ).appendTo('#Table1');
                    }
                    no = no+1;
            });
        }
    });
}, 1000);
});
</script>

I am not sure but i think it's helpful to you.