在WordPress上创建插件时,如何将DataTable与AJAX结合使用?

时间:2020-03-11 作者:Rhalp Darren Cabrera

您好,我想制作一个与DataTable集成的插件,但我在url中调用ajax时遇到了一个问题。这是我的插件目录。

enter image description here

  • 英寸index.php 我使用admin_enqueue_scripts 对于datatable CDN
  • page_handler.php 处理页面html
  • cdt.js where my customize js&;jqueryWordPress, u可以使用url:"datatables/tasklist.php" 使用json编码的数据调用自定义php文件WordPress 您必须使用admin-ajax.php?action=my_custom_json 为了调用ajax。

    cdt.js

    jQuery(document).ready(function() {
    
    var tasklist_table = jQuery(\'#tasklist_table\').DataTable({
           "lengthChange": false,
           "autoWidth": false,
           "searching": true,
           "ordering": false,
           "processing":true,
           "serverSide":true,
           "order":[],
           "ajax":{
             url:"admin-ajax.php?action=tasklist_dt",
             type:"POST"
           },
           "columnDefs":[
             {
               "targets":[0],
               "orderable":false,
             },
           ],
        });
    
    });
    
    我希望有人能帮助我在使用ajax时如何正确调用分离的php文件。

1 个回复
最合适的回答,由SO网友:Rhalp Darren Cabrera 整理而成

我自己问题的解决方案:

将您的自定义file.js 并本地化admin-ajax.php.

index.php

    function script_enqueue() {

        // Register the JS file with a unique handle, file location, and an array of dependencies
        wp_register_script("dt_csc", plugin_dir_url(__FILE__).
            \'js/cdt.js\', array(\'jquery\'));

        // localize the script to your domain name, so that you can reference the url to admin-ajax.php file easily
        wp_localize_script(\'dt_csc\', \'myAjax\', array(\'ajaxurl\' => admin_url(\'admin-ajax.php\')));

        // enqueue jQuery library and the script you registered above
        wp_enqueue_script(\'jquery\');
        wp_enqueue_script(\'dt_csc\');
    }
    add_action(\'init\', \'script_enqueue\');
创建函数示例

index.php

if ( !function_exists( \'client_json\' ) ) {

    function client_json() {
        //global object to perform database operation
        global $wpdb;
        //include the php file responsible for generating json for datatable 
        include_once plugin_dir_path( __FILE__ ) . \'/datatables/client.php\';
        // Kills WordPress execution  
        wp_die();
    }
    // wp_ajax is a authenticated Ajax
    add_action(\'wp_ajax_client_json\', \'client_json\' ); 
    //wp_ajax_nopriv is a non-authenticated Ajax
    add_action(\'wp_ajax_nopriv_client_json\', \'client_json\' ); 
}

然后在Ajax URL上使用admin-ajax.php“要调用生成JSON的函数,{action:"**function_name**",extra_param:"extra_value"}

cdt.js

var client_table = jQuery(\'#client_table\').DataTable({
       "lengthChange": false,
       "autoWidth": false,
       "searching": true,
       "ordering": false,
       "processing":true,
       "serverSide":true,
       "order":[],
       "ajax":{
         url:"admin-ajax.php",
         data:{action:"client_json"},
         type:"POST"
       },
       "columnDefs":[
         {
           "targets":[0],
           "orderable":false,
         },
       ],
});
标签: