Php 如何在每次ajax调用之前清除表中的数据

每次ajax调用后，表数据都不会被清除。新数据附加在先前数据的下方

$（“#显示#数据”）.remove（）； 我试过这个，但不起作用

查看

<table id="example2" class="table table-bordered table-hover">
                        <thead>
                        <tr>
                            <th>Title</th>
                            <th>Description</th>
                            <th>Date</th>
                            <th>Time</th>
                            <th>Action</th>
                        </tr>
                        </thead>
                        <tbody id="show_data">

                        </tbody>
                    </table>

标题
描述
日期
时间
行动

剧本

<script>
    $(document).ready(function () {

        //Date picker
        $('#datepicker').datepicker({
            autoclose: true,
            format: 'yyyy-mm-dd',
        });

        $("#datepicker").attr("autocomplete", "off");


    $(document).on('submit','#myform',function(){
        event.preventDefault();
        var date = $('#datepicker').val();
        console.log(date);
        $('#show_data').remove();
        $.ajax({
            type:"POST",
            url:"<?php echo base_url().'admin/Dashboard/get_blog'; ?>",
            data:{date:date},
            dataType: "json",
            success:function(data) {
                console.log(data[0].blog_id);
                let i;

                for(i=0;i<data.length;i++){

                    $('#show_data').append('<tr><td>' + data[i].article_name + '</td>' +
                        '<td>' + data[i].description + '</td>' +
                        '<td>' + data[i].date + '</td>' +
                        '<td>' + data[i].time + '</td>' +
                        '</tr>');
                }
            },
            error: function() {
                alert("oops...");
            },

        });
    });
 });

</script>

$（文档）.ready（函数（）{
//日期选择器
$（“#日期选择器”）。日期选择器({
自动关闭：是的，
格式：“yyyy-mm-dd”，
});
$（“#日期选择器”）.attr（“自动完成”、“关闭”）；
$（文档）.on（'submit'，'#myform'，function（）{
event.preventDefault（）；
var date=$（'#datepicker'）.val（）；
控制台日志（日期）；
$（“#显示#数据”）.remove（）；
$.ajax({
类型：“POST”，
url:“”，
数据：{date:date}，
数据类型：“json”，
成功：功能（数据）{
console.log（数据[0].blog\u id）；
让我；
对于（i=0；i 2019-05-25->提交

输出->数据1
数据2

输入->2019-05-24->提交

输出->数据1
数据2
数据3

预期产出

输入->2019-05-25->提交

输出->数据1
数据2

输入->2019-05-24->提交

输出->数据3
这是因为您将响应附加到以前的数据。请尝试这种方法

$.ajax({
    type:"POST",
    url:"<?php echo base_url().'admin/Dashboard/get_blog'; ?>",
    data:{date:date},
    dataType: "json",
    success:function(data) {
        console.log(data[0].blog_id);
        let i;

        let html= '';

        for(i=0;i<data.length;i++){

            html += '<tr><td>' + data[i].article_name + '</td>' +
                '<td>' + data[i].description + '</td>' +
                '<td>' + data[i].date + '</td>' +
                '<td>' + data[i].time + '</td>' +
                '</tr>');
        }

        $('#show_data').html(html);
    },
    error: function() {
        alert("oops...");
    },

});

$.ajax({
类型：“POST”，
url:“”，
数据：{date:date}，
数据类型：“json”，
成功：功能（数据）{
console.log（数据[0].blog\u id）；
让我；
让html=''；
对于（i=0；i您可以尝试更改代码

$('#show_data').remove();

到

empty（）
函数将清除元素的内容。文档在这里
试试这个
$（'#form_id'）。trigget（'reset'）；
@Danish Ali
$（'#form_id'）。trigger（'reset'）；
只清除表单中的输入字段，而不清除表内容。@Kallol Medhi Try
$（'#show#data'）。empty（）
$('#show_data').empty();