如何使用AJAX从数据库显示并在WordPress插件中加载更多内容

时间:2017-08-14 作者:Pavan Kalyan

我开发了一个插件。它会自动在数据库中创建视频URL。

该表由id、标题、URL和Thurl组成。我们可以使用wp管理面板的表单将内容发送到数据库(如果pk视频)。

我想从数据库中检索行并显示它们。首先,当页面加载时,它应该只显示3个URL,当单击“加载更多”时,它应该显示3个以上,以此类推。基本上,我需要知道如何在WordPress中实现ajax。

http://demos.codexworld.com/load-more-data-using-jquery-ajax-php-from-database/Wordpress插件应该制作类似于上述URL的内容。

请帮我解决这个问题。

下面是它的代码。

    <?php
/*
Plugin Name: pkvideos
Plugin URI: http://pavan.com
Author: Pavan 
Version: 1.0
Description: Videos of IndianFolk.
Text Domain: pavan
Requires at least: 3.0
Tested up to: 4.7.3
*/

add_action(\'admin_menu\', \'test_plugin_setup_menu\');

function test_plugin_setup_menu(){
        add_menu_page( \'If Videos\', \'If Videos by PK\', \'manage_options\', \'if-videos-by-pk\', \'postvideo\' );
        add_submenu_page(\'if-videos-by-pk\', \'Edit Videos\', \'Edit Videos\', \'manage_options\', \'if-videos-edit\' );
        add_submenu_page(\'if-videos-by-pk\', \'About Me\', \'About Me\', \'manage_options\', \'if-videos-about\' );
}

function postvideo(){
        echo "<h1>IndianFolk Videos</h1>";

        ?>
        <form action="" method="post">
 Title :<input type="text" name="title" required><br>
 Video Url: <input type="text" name="url" required><br>
 Thumbnail Url: <input type="text" name="thurl" required><br>
 <input type="submit" value="Submit" name="submit">
</form>


        <?php
        if(isset($_POST[\'submit\'])){ //check if form was submitted
  $title = $_POST[\'title\']; //get input text
  $url = $_POST[\'url\'];
  $thurl = $_POST[\'thurl\'];
  $aData = array(
            \'title\' => $title,
            \'url\' => $url,
            \'thurl\'=> $thurl
            );

  global $wpdb;
  $res = $wpdb->insert(\'wp_ifvideos\', $aData);      
   $siteurll=get_site_url();

} 

}

function create_plugin_database_table() {
 global $wpdb;
 $table_name = $wpdb->prefix . \'ifvideos\';
 $sql = "CREATE TABLE $table_name (
 id mediumint(9) unsigned NOT NULL AUTO_INCREMENT,
 title varchar(50) NOT NULL,
 url longtext NOT NULL,
 thurl longtext NOT NULL,
 PRIMARY KEY  (id)
 );";

 require_once( ABSPATH . \'wp-admin/includes/upgrade.php\' );
 dbDelta( $sql );
}

register_activation_hook( __FILE__, \'create_plugin_database_table\' );

/*=//This is used for adding form as the shortcode in pages or posts or widgets
function wp_first_shortcode(){
echo "Hello, This is your another shortcode!";
?>

<form action="" method="post">
 Title :<input type="text" name="title"><br>
 Url: <input type="text" name="url"><br>
 Thumbnail Url: <input type="text" name="thurl"><br>
 <input type="submit" value="Submit" name="submit">
</form>
<?php

if(isset($_POST[\'submit\'])){ //check if form was submitted
  $title = $_POST[\'title\']; //get input text
  $url = $_POST[\'url\'];
  $thurl = $_POST[\'thurl\'];
  $aData = array(
            \'title\' => $title,
            \'url\' => $url,
            \'thurl\'=> $thurl
            );

  global $wpdb;
  $res = $wpdb->insert(\'wp_ifvideos\', $aData);      
   $siteurll=get_site_url();

}  

}//this is used for adding short code 
add_shortcode(\'first\', \'wp_first_shortcode\');*/

function videos_info() 
{
    global $wpdb; 

$videos = $wpdb->get_results( "SELECT * FROM wp_ifvideos ORDER BY id DESC" , ARRAY_N);

foreach ( $videos as $video ) {
    //Here $user[1], 1 is the column number.
    echo do_shortcode("[video width=\'256\' height=\'144\' 
 poster=\'$video[3]\' mp4=\'$video[2]\'][/video]");
 echo $video[1]. \'<br>\';
}
?>

<?php
}
add_shortcode(\'showinfo\',\'videos_info\');


function video_ajax()
{
    ?>

    <?php

}
 add_shortcode(\'ajaxvideo\',\'video_ajax\');
?>
请帮助我更改以下代码。

$videos = $wpdb->get_results( "SELECT * FROM wp_ifvideos ORDER BY id DESC" , ARRAY_N);

foreach ( $videos as $video ) {
    //Here $user[1], 1 is the column number.
    echo do_shortcode("[video width=\'256\' height=\'144\' 
 poster=\'$video[3]\' mp4=\'$video[2]\'][/video]");
 echo $video[1]. \'<br>\';
}
?>

<?php
}
add_shortcode(\'showinfo\',\'videos_info\');


function video_ajax()
{
    ?>

    <?php

}

2 个回复
最合适的回答,由SO网友:majick 整理而成

这里有一种方法,使用iframe 对于AJAX请求,学习和调试AJAX代码要容易得多。。。尝试以下操作:

function videos_info() {
    global $wpdb; 

    // add LIMIT 3 here
    $videos = $wpdb->get_results( "SELECT * FROM wp_ifvideos ORDER BY id DESC LIMIT 3" , ARRAY_N);

    foreach ( $videos as $video ) {
        echo do_shortcode("[video width=\'256\' height=\'144\' poster=\'$video[3]\' mp4=\'$video[2]\'][/video]");
        echo $video[1]. \'<br>\';
    }

    $ajaxurl = admin_url(\'admin-ajax.php\');
    echo "<iframe style=\'display:none;\' name=\'loadmorevids\' id=\'loadmorevids\' src=\'javascript:void(0);\'></iframe>";
    echo "<script>function loadmorevideos(offset) {
        document.getElementById(\'loadmorevids\').src = \'".$ajaxurl."?action=video_ajax&offset=\'+offset;}</script>";    
    echo "<div id=\'morevideos-3\'><a href=\'javascript:void(0);\' onclick=\'loadmorevideos(\\"3\\");\'>Load More Videos</a></div>";
}

// For Logged in Users
add_action(\'wp_ajax_video_ajax\', \'video_ajax\');
// For Logged Out Users
add_action(\'wp_ajax_video_ajax\', \'video_ajax\');

function video_ajax() {

    global $wpdb;    
    $videos = $wpdb->get_results( "SELECT * FROM wp_ifvideos ORDER BY id DESC" , ARRAY_N);

    $offset = $_GET[\'offset\']; $html = \'\';
    foreach ( $videos as $i => $video ) {
        // limit to 3 videos using offset
        if ( ($i > ($offset-1)) && ($i < ($offset+2)) ) {
            $html .= do_shortcode("[video width=\'256\' height=\'144\' poster=\'$video[3]\' mp4=\'$video[2]\'][/video]");
            $html .= $video[1]. \'<br>\';
        }
    }

    // append the new load more link
    $html .= \'<div id="morevideos-\'.($offset+3).\'">\';
    $html .= \'<a href="javascript:void(0);" onclick="loadmorevids(\'.($offset+3).\');">Load More Videos</a></div>\';

    // replace any single quotes with escaped ones
    $html = str_replace("\'", "\\\\\'", $html);
    // (or alternatively)
    // $html = str_replace("\'", "&apos;", $html);

    // replace the previous loadmore link with the loaded videos
    echo "<script>parent.document.getElementById(\'morevideos-".$offset."\').innerHTML = \'".$html."\';</script>";
    exit;

}

SO网友:Thamaraiselvam

下面是Codex以进行适当的ajax调用https://codex.wordpress.org/AJAX_in_Plugins

向Ajax添加操作非常简单。

另请阅读noncehttps://codex.wordpress.org/WordPress_Nonces

结束