[英]How to insert data JSON in JavaScript variable to datatable
我有來自ajax jQuery的數據JSON結果,我將其保存在變量中,然后要將變量中的JSON插入到datatable中,但是現在該插入是來自url的數據json。
我試圖用變量結果myjson更改變量值,但仍然無法正常工作。 這是我的代碼:
的JavaScript
<script>
var myTable = $('#my_logs').DataTable({
"paging": true,
"lengthChange": true,
"searching": true,
"ordering": true,
"info": true,
"autoWidth": true,
"data": [],
"columns": [{
"title": "Date",
"data": "log_time"
}, {
"title": "User Name",
"data": "user_name"
}, {
"title": "Class",
"data": "class_name"
}, {
"title": "Function",
"data": "class_function"
}, {
"title": "Action",
"data": "action_title"
}, {
"title": "Description",
"data": "action_description"
}]
});
$(document).ready(function() {
$("#search").click(function() {
var start_date = $('#start_date').val();
var end_date = $('#end_date').val();
console.log(start_date);
console.log(end_date);
if(startDate != '' && endDate !='')
{
var startDate = new Date(start_date);
var endDate = new Date(end_date);
let url = 'http://localhost/APICI/index.php/api/cektable';
fetch(url)
.then(res => res.json())
.then((out) => {
var resultProductData = out.filter(function(a) {
var createdAt = new Date(a.log_time);
if( createdAt >= startDate && createdAt <= endDate )
return a;
});
console.log(resultProductData);
$.ajax({
url: 'http://localhost/APICI/index.php/api/cektablee',
data: {
json: JSON.stringify(resultProductData)
},
type: "POST",
timeout: 30000,
dataType: "json", // "xml", "json"
success: function(logs) {
myTable.clear();
$.each(logs, function(index, value) {
myTable.row.add(value);
});
myTable.draw();
},
error: function(jqXHR, textStatus, ex) {
alert(textStatus + "," + ex + "," + jqXHR.responseText);
}
});
})
.catch(err => { throw err });
}
else
{
alert("Both Date is Required");
}
});
});
</script>
我想向datatable插入哪個是變量resultProductData中的 json值,但是現在結果是來自ajax http://localhost/APICI/index.php/api/cektablee中 url的 json
這是來自變量resultProductData json數據結果var的結果json,但這是datatable json數據結果url中的結果
這可能會幫助您:
經過測試並且數據正確添加,如果有任何查詢,請告知我
<!-- DataTables CSS --> <link rel="stylesheet" type="text/css" href="http://ajax.aspnetcdn.com/ajax/jquery.dataTables/1.9.4/css/jquery.dataTables.css"> <link rel="stylesheet" type="text/css" href=" https://cdn.datatables.net/1.10.12/css/dataTables.bootstrap.min.css"> <!-- jQuery --> <script type="text/javascript" charset="utf8" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.2.min.js"></script> <!-- DataTables --> <script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/1.10.12/js/jquery.dataTables.min.js"></script> <html> <body> <div class="container"> <table id="my_logs" class="table table-striped table-bordered" style="width:100%"> <thead> </thead> <tbody> </tbody> </table> </div> </body> <script type="text/javascript"> $(document).ready(function () { var myTable = $('#my_logs').DataTable({ "paging": true, "lengthChange": true, "searching": true, "ordering": true, "info": true, "autoWidth": true, "data": [], "columns": [{ "title": "Date", "data": "log_time" }, { "title": "User Name", "data": "user_name" }, { "title": "Class", "data": "class_name" }, { "title": "Function", "data": "class_function" }, { "title": "Action", "data": "action_title" }, { "title": "Description", "data": "action_description" }] }); var logs = [{ "log_time": "2019-08-27", "user_name": "Me", "class_name": "login", "class_function": "authentication", "action_title": "User login", "action_description": "I am logged in" }, { "log_time": "2019-08-17", "user_name": "me", "class_name": "dashboard", "class_function": "index", "action_title": "Admin dashboard", "action_description": "I am logged in" }]; myTable.clear(); $.each(logs, function(index, value) { myTable.row.add(value); }); myTable.draw(); }); </script> </html>
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.