使用wp_Insert_Post()和AJAX创建页面

时间:2016-06-16 作者:Ryan Dorn

我一直在想如何使用wp_insert_post() 还有AJAX。。。到目前为止没有任何效果。

我希望实现的目标:

任何用户(不仅仅是登录用户,我现在不想乱弄权限)都可以创建帖子。要创建帖子,我只需要一个输入和一个按钮,并且只能创建标题(其他内容设置为默认)

将我的JS排入队列,尝试(显然失败)创建插入帖子的函数wp_insert_post()


/* Enqueue JS
----- */ 

function post_via_ajax_scripts() {  
    wp_register_script( \'post-via-ajax-js\', plugin_dir_url( __FILE__ ) . \'post_via_ajax.js\', array( \'jquery\' ), \'\', true );
    wp_localize_script( \'post-via-ajax-js\', \'pva_params\', array( \'pva_ajax_url\' => admin_url( \'admin-ajax.php\' ) ) );
    wp_enqueue_script( \'post-via-ajax-js\' );
}
add_action(\'wp_enqueue_scripts\', \'post_via_ajax_scripts\');

//Add Ajax Actions
add_action(\'wp_post_via_ajax\', \'post_via_ajax\');
add_action(\'wp_post_via_ajax\', \'post_via_ajax\');

/* WP Insert Post Function
----- */ 

function post_via_ajax()
{

    $query_post_via_ajax = $_POST;
    $post_title = ($query_post_via_ajax[\'post_title\']) ? $query_post_via_ajax[\'post_title\'] : false;

    // Create post object
    $new_pva_post = array(
        \'post_type\'     => \'page\',
        \'post_title\'    => wp_strip_all_tags($post_title ),
        \'post_status\'   => \'publish\',
        \'post_author\'   => 1,
    );

    // Insert the post into the database
    wp_insert_post( $new_pva_post );
    exit();
};    
/* Form Shortcode
----- */ 

function post_via_ajax_shortcode( $atts, $content = null ) {
    return \'<input id="post_title" name="post_title" type="text"><button id="create_post">Create Post</button>\';
}

add_shortcode( \'post_via_ajax\', \'post_via_ajax_shortcode\' );
这是我的JS,它。。。

有一个非常简单的验证,要求标题超过5个字符,试图(但失败)通过ajax创建帖子并通过\'post_title\'post_via_ajax() 功能

jQuery( document ).ready( function ( $ ) {

    $(\'#create_post\').attr(\'disabled\',true);
    $(\'#post_title\').keyup(function(){
        if($(this).val().length > 3) {
            $(\'#create_post\').attr(\'disabled\', false);
            $(\'#create_post\').click(function(event){
                post_via_ajax();
            });
        } else {
            $(\'#create_post\').attr(\'disabled\',true);    
        }
    });

    // Return Post Title Field Value
    function returnNewPostTitle(){
        var newPostTitleValue = $(\'#post_title\').val();
        return newPostTitleValue;
    }

    // AJAX > Get City Posts
    function post_via_ajax()
    {
        console.log(\'woo\');
        var pva_ajax_url = pva_params.pva_ajax_url;

        //alert(\'woo\');*/
        $.ajax({
            type: \'POST\',
            url: pva_ajax_url,
            data: {
                action: \'post_via_ajax\',
                post_title: returnNewPostTitle(),
            },
            beforeSend: function ()
            {
                console.log(\'sending\');
            },
            success: function(data)
            {
                console.log(\'yay\');
            },
            error: function()
            {
                console.log(\'nay\');

            }
        })
    }
});
在这一点上,我不知道我在做什么,所以如果可能的话,我真的很感激任何见解。

提前感谢!

1 个回复
SO网友:Ryan Dorn

好吧,在做了一些手脚之后,我的工作开始了。

结果是我设置了add_action AJAX部件的挂钩不正确。

挂钩需要:

add_action( \'wp_ajax_nopriv_MYFUNCTION\', \'MYFUNCTION\' );

add_action( \'wp_ajax_MYFUNCTION\', \'MYFUNCTION\' );

...在我的案例和原始代码中,所讨论的函数(“MYFUNCTION”)是通过wp_insert_post().

因此,在清理了我的namin约定和代码之后,我有以下内容:

PHP

/**
 Plugin Name: Post via Ajax
 */

/* Enqueue JS
----- */ 

function pva_scripts() {
    wp_register_script( \'pva-js\', plugin_dir_url( __FILE__ ) . \'pva.js\', array( \'jquery\' ), \'\', true );
    wp_localize_script( \'pva-js\', \'pva_params\', array( \'pva_ajax_url\' => admin_url( \'admin-ajax.php\' ) ) );
    wp_enqueue_script( \'pva-js\' );
};

add_action(\'wp_enqueue_scripts\', \'pva_scripts\');

// creating Ajax call for WordPress
add_action( \'wp_ajax_nopriv_pva_create\', \'pva_create\' );
add_action( \'wp_ajax_pva_create\', \'pva_create\' );

/* WP Insert Post Function
----- */ 

function pva_create()
{

    $post_title = $_POST[\'post_title\'];

    // Create post object
    $new_pva_post = array(
        \'post_type\'     => \'page\',
        \'post_title\'    => $post_title,
        \'post_status\'   => \'publish\',
        \'post_author\'   => 1,
    );

    // Insert the post into the database
    wp_insert_post( $new_pva_post );
    exit();
};



/* Form Shortcode
----- */ 

function pva_shortcode( $atts, $content = null ) {
    ob_start();
    include(plugin_dir_path( __FILE__ ) . \'post_via_ajax_field.php\');
    $ret = ob_get_contents(); 
    ob_end_clean(); 
    return $ret;
        //pva();
};

add_shortcode( \'pva\', \'pva_shortcode\' );
JS公司

<小时>

jQuery( document ).ready( function ( $ ) {

    $(\'#create_post\').attr(\'disabled\',true);
    $(\'#post_title\').keyup(function(){
        if($(this).val().length > 3) {
            $(\'#create_post\').attr(\'disabled\', false);
        } else {
            $(\'#create_post\').attr(\'disabled\',true);    
        }
    });

    $(\'#create_post\').click(function(event){
        post_via_ajax();
    });

    // Return Post Title Field Value
    function returnNewPostTitle(){
        var newPostTitleValue = $(\'#post_title\').val();
        return newPostTitleValue;
    }

    // AJAX > Get City Posts
    function post_via_ajax()
    {
        var pva_ajax_url = pva_params.pva_ajax_url;

        $.ajax({
            type: \'POST\',
            url: pva_ajax_url,
            data: {
                action: \'pva_create\',
                post_title: returnNewPostTitle()
            },
            beforeSend: function ()
            {
                console.log(\'sending\');
            },
            success: function(data)
            {
                console.log(\'yay\');
            },
            error: function()
            {
                console.log(\'nay\');

            }
        })
    }
});
因此,将其作为插件并使用短代码[pva],您可以从前端创建帖子。显然,这只是为了非常基本,所以我想你可以根据自己的需要进行调整。希望这对某人有所帮助。:)

编辑:我还做了一个超级基础GitHub repo 使用代码。

相关推荐

尝试在WordPress中实现AJAX注释,遇到WP错误

我试图在WordPress中为我的评论实现Ajax,使用this tutorial. 但我在将教程中的代码集成到自己的预构建主题时遇到了问题。问题是,我要么得到一个WP错误“检测到重复注释;看来你已经说过了!”或标准500错误。以下是我得到的:下面是我对ajax的评论。js文件如下所示: * Let\'s begin with validation functions */ jQuery.extend(jQuery.fn, { /* * check i