After receiving a JSON result from an AJAX jQuery call, I stored it in a variable and attempted to insert the JSON data into a datatable. However, instead of inserting the data from the variable as intended, the datatable is currently populated with JSON data from a URL.
Despite my efforts to update the variable value with the JSON data stored in 'myjson', the operation still failed. The following is a snippet of my code:
JavaScript
<script>
var myTable = $('#my_logs').DataTable({
"paging": true,
... // data table setup parameters
});
$(document).ready(function() {
$("#search").click(function() {
var start_date = $('#start_date').val();
var end_date = $('#end_date').val();
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) {
// date filter logic
});
console.log(resultProductData);
$.ajax({
url: 'http://localhost/APICI/index.php/api/cektablee',
... // ajax request details
});
})
.catch(err => { throw err });
}
else {
alert("Both Date is Required");
}
});
});
</script>
Although I want the datatable to display values from the JSON data saved in the variable resultProductData, it currently shows data fetched from this URL through an AJAX call.
The JSON data stored in the variable resultProductData can be viewed here. Whereas, the data visible in the datatable originates from this URL.