Ajax datatable is working in firefox browser but running the same gives error datatable is not a function in chrome browser.
Not getting whats the exact issue and how to tackle it
Here’s the error
But same is working in Firefox
Need help on urgent basis
Datatable is a large library and needs to be loaded using frappe.run_serially or there will be async problems. This is the second hit when I searched for datatable.
Not worked, problem still persists
I’m not sure how we’re supposed to help without seeing your code.
var headhtml="<div class='portlet-body'><div class='row'><div class='col-md-8 input-daterange pull-right'><div class='col-md-3'><input type='text' name='start_date' id='start_date' placeholder='From' class='form-control' readonly='true' /></div><div class='col-md-3'><input type='text' placeholder='To' name='end_date' id='end_date' class='form-control' readonly='true' /></div><div class='col-md-2'><a><span class='glyphicon glyphicon-search' id='search' title='Search' style='font-size:20px;color:blue;'></a> <a><span class='glyphicon glyphicon-refresh' id='reset' title='Reset' style='font-size:20px;color:blue;'></a></span></div></div></div><div class='table-responsive'><table id='dell' class='table table-bordered table-striped'><thead><tr><th>Customer Name</th><th>Customer Id</th><th>Market</th><th>SO Type</th><th>Pack</th><th>Category</th><th>Service Name</th><th>Customer Type</th><th>Mobile</th><th>Start Date</th><th>End Date</th></tr></thead></div></div>";
$("[data-fieldname='preview']").html(headhtml);
frappe.ui.form.on("Active Clients","onload",function(frm){
//Including Libraries
frappe.require([
"assets/js/jquery.dataTables.min.js",
"assets/css/jquery.dataTables.min.css"
])
frappe.call({
'method': 'frappe.client.get_list',
'args':{
'doctype': 'App',
'fields': ['name','your_message']
// 'limit_start':0,
// 'limit_page_length': 10
},
async: false,
callback: function(r)
{
}
});
//end of frappe call
$(document).ready(function() {
//Datatable
var tab_data=$('#dell').DataTable({
"processing": true,
"serverSide": true,
//"scrollY": 200,
// "scrollY": true,
//"dataType": "json",
"ajax": {
"url": 'http://myurl',
"dataType": "json",
"type": "POST",
"data": function (d){
d.apiname='active_datatable';
return JSON.stringify(d)
},
},
columns:[{"data": "customer_name"},{"data": "customer_id"},{"data": "mkt"},{"data": "type"},{"data": "pack"},{"data": "category"},{"data": "service"},{"data": "customer_type"},{"data": "mobile"},{"data": "start_date"},{"data": "end_date"}],
order:[[ 2, "desc" ]]
});
});
I’m calling an api to push data to datatable . For firefox its working but not for chrome
I don’t know enough about the differences between how Chrome and Firefox handle ajax to answer this question, but it seems like it’s not a Frappe-specific problem at this point.
I can add jQuery Datatable from external javascript and CSS style.
I tested and work on Chrome and Firefox.
Please read this post
Adding jQuery Datatable from external javascript and CSS style with client-side custom script
