Question

我正在尝试使用jquery ajax搜索日期范围并在datatable中显示数据。 这是我的php控制器代码。

 public function date()
{
    $date_from = date('Y-m-d H:i:s', strtotime($this->input->post('date_from')));
    $date_to = date('Y-m-d H:i:s', strtotime($this->input->post('date_to')));

    if ($date_from != "" && $date_to != "") {
        $data[] = $this->report_model->get_report_by_date($date_from, $date_to);
        $output= $data;
    }

    echo json_encode($output);

}

这是我的Javascript代码

$('#filterDate').click(function () {
    var from_date = $('#from_date').val();
    var to_date = $('#to_date').val();

    if (from_date != '' && to_date != '') {
        $.ajax({
            url: "<?php echo base_url(); ?>report/date",
            method: "POST",
            data: {date_from: from_date, date_to: to_date},
            dataType: "json",


            success: function (output) {

                $("#reportDataOld").remove();
                var json = $.parseJSON(output);
                alert(json.html);
                if (output == "err") {
                    alert("Something Happened Wrong! Please Try Again.");
                } else {
                    $("#reportDataNew").html(output);
                    console.log(output);
                }


            }
        })
        ;
    }
    else {
        alert("Please Select Date");
    }
});

我收到这样的json响应

enter image description here

但是无法在Datatable中表示数据。

Answer 1

是的，我确实编辑了此行，以了解Ajax的成功及其工作。

success: function (output) {

                $("#reportDataOld").remove();

                if (output == "err") {
                    alert("Something Happened Wrong! Please Try Again.");
                } else {
                    var trHTML = '';
                    $.each(output.ReportArr, function (i, obj) {
                        trHTML += '<tr><td>' + obj.id + '</td><td>' + obj.created_datetime + '</td><td>' + obj.product_name + ' </td><td>' + obj.party_name + '</td><td>' + obj.quantity + '</td><td>' + obj.sup_charge_vat_total + '</td><td>' + obj.value_added_tax_qty + '</td><td></td></tr>';
                    });
                    $('#reportDataOld').append(trHTML);
                }
            }

Answer 2

您甚至没有使用数据表。您尝试过dataTable的方法吗？

success: function (data, status) {
    let table = $('table').DataTable();
    table.clear();
    let array = $.map(data, function (key) {
        return key;
    });
    $.each(array, function( index, value ) {
        let row = table.row.add([
                                    array[index]['id'],
                                    array[index]['party_id']
                                ]);
        row.draw();
    });
},

如何使用jQuery ajax请求在数据表中显示json响应数据？

2 个答案: