Question

我正在尝试在Wordpress中的仪表板上刷新小部件。

我的插件是用PHP编写的，但我正在尝试添加Jquery / AJAX来刷新每个小部件时进行一些更改。

PHP中的函数将下载并存储文件，然后将信息显示在窗口小部件中。

我遇到的问题是：文件已成功下载并存储。但新信息并未显示。它保持不变。我相信它可能很简单，但我一直试图让它工作一段时间但没有成功。

以下是我的代码示例：

<?php

add_action( 'admin_footer', 'my_action_javascript' ); // Write our JS below here


function my_action_javascript() { ?>
<script type="text/javascript" >
jQuery(document).ready(function($) {

    var data = {
        'action': 'refresh_function',
    };


            setInterval(function() {
    $.get(ajaxurl, data, function (result) {

    });

            },20000);

});
</script> <?php
}

add_action('wp_ajax_refresh_function', 'display_function');

PHP函数：

function display_function()
{


$conn_id = ftp_connect($ftp_server);

$login_result = ftp_login($conn_id, $ftp_user_name, $ftp_user_pass);

if (ftp_get($conn_id, $local_file, $server_file, FTP_BINARY)) {


ftp_close($conn_id);

$path = __DIR__."/XML/File.xml";  
$channel = simplexml_load_file($path);   


echo "<div style='overflow:auto; height:400px;'>";


    foreach ($channel->channel->item as $item)  
    {            

        echo "<div class='xppArticle'>";
        echo "<h2>" . $item->title . "</h2>";                

        echo "<p>". set_paragraph_length_display($item->description, 250) . "(...)" . "</p>";



            global $wpdb;  
            $query = $wpdb->prepare('SELECT ID FROM ' . $wpdb->posts . ' WHERE post_title = %s', $item->title); 
            $cID = $wpdb->get_var($query);   

            echo "<hr />";
        echo "</div>";
    }
echo "</div>";    
}

我的理解是我的AJAX会调用该函数，它会正常工作。我想我错了，因为一旦我使用AJAX下载新文件，屏幕上就不会显示任何新内容。

谢谢！

Answer 1

好的，首先，远程设置你的脚本。这是我做过的一个演示：

function ajaxurl(){
    wp_enqueue_script('product-selector', get_template_directory_uri().'/js/ajax.js', array('jquery')); // Remotely place script in /js/ folder in my theme.
    wp_localize_script('product-selector', 'MyAjax', array(
        // URL to wp-admin/admin-ajax.php to process the request
        'ajaxurl' => admin_url('admin-ajax.php'),
        )
    );
}

add_action('wp_head', 'ajaxurl');

接下来，你需要确保你排队no-priv和admin：

add_action('wp_ajax_nopriv_ajax_callback', 'ajax_callback');
add_action('wp_ajax_ajax_callback', 'ajax_callback');

在我的脚本中，“ajax_callback”是我运行的php函数。所以你需要相应调整。

另外，在js中，您需要将ajaxUrl看作：

MyAjax.ajaxurl

如果您直接使用我的代码而不进行调整。

WordPress上的AJAX有点难以入手，但一旦你开始滚动，它就有意义了。使用开发人员工具并切换到Chrome上的“控制台”选项以进行调试，并查看您正在返回的信息（如果有）。

Answer 2

您的ajax回调函数为空。选择要将ajax输出放入的元素，然后将其innerhtml设置为该代码。

$.get(ajaxurl, data, function (result) {
    $( '#my-dashboard-widget-content-element' ).html( result );
});

确保您拥有相应的操作集，就像在另一个答案中一样：

add_action('wp_ajax_refresh_function', 'display_function' );
add_action('wp_ajax_nopriv_refresh_function', 'display_function' );

此外，您应该使用随机数来验证其授权的ajax请求。在php函数的最后，不要忘记die（）;

要获得全面的概述，请查看http://codex.wordpress.org/AJAX_in_Plugins

如何使用AJAX正确刷新Wordpress上的数据

2 个答案: