I am using a datatable to load items from database in a custom wordpress plugin. But I keep getting this error 'Uncaught TypeError: $(...).dataTable is not a function'. This is a common question but all the solutions are same and I have checked them all. The jquery and datatable libraries are loaded in correct order, no mistake in the library links and none of them loaded twice. what can be any other cause for this error?? Below is how the libraries enqueued:
if (!function_exists('current_actives_mng_enqueue'))
{
function current_actives_mng_enqueue()
{
// JS
wp_register_script('cur_act_mng_jquery', '//code.jquery.com/jquery.min.js');
wp_register_script('cur_act_mng_bootstrap_js', '//maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js');
wp_register_script('cur_act_mng_bootstrap_popper_js', '//cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js');
wp_enqueue_script('cur_act_mng_datatable_js','//cdn.datatables.net/1.10.22/js/jquery.dataTables.min.js',array('jquery'));
wp_enqueue_script('cur_act_mng_jquery');
wp_enqueue_script('cur_act_mng_bootstrap_js');
wp_enqueue_script('cur_act_mng_bootstrap_popper_js');
wp_enqueue_script('cur_act_mng_datatable_js');
// CSS
wp_register_style('cur_act_mng_bootstrap', '//maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css');
wp_register_style('cur_act_mng_datatable_css', '//cdn.datatables.net/1.10.22/css/jquery.dataTables.min.css');
wp_register_style('cur_act_mng_custom', plugins_url('css/style.css', __FILE__));
wp_enqueue_style('cur_act_mng_bootstrap');
wp_enqueue_style('cur_act_mng_datatable_css');
wp_enqueue_style('cur_act_mng_custom');
}
add_action('wp_enqueue_scripts', 'current_actives_mng_enqueue');
}
This is the js code for loading the table:
jQuery(document).ready(function($){
$('#cur_act_tbl').dataTable({
ajax: {
url: "/wp-admin/admin-ajax.php?action=datatables_endpoint",
cache:false,
},
columns: [
{ data: 'mls' },
{ data: 'status' },
],
pageLength: 25
});
CodePudding user response:
Replacing $
with jQuery
might help
jQuery('#cur_act_tbl').dataTable(