web-dev-qa-db-ja.com

でメタ値を更新する AJAX

私はWordpressの投票システムに取り組んでいます。私は最初にGETリクエストでそれを作りました、しかし誰かが私に言った あなたはこれのためにGETを使うべきではない 、それで私はAJAXで働き始めましたこの記事を読んだ後 、カスタムフィールド/メタ値を更新してください 。 jQueryとWordpressのAJAXページからたくさんのドキュメントを読んだことがあります。

私は順調に進んでいると思いますが、足りないものがあるか、または間違っています。

私は以前にGETリクエストでこれをテストしたので、投票関数はうまく機能します。

私はこの簡単なHTMLテストフォームを持っています:

<form id="vote_form" method="post">
    <input type="hidden" id="id" name="id" value="810">
    <input type="hidden" id="post_id" name="post_id" value="811">
    <input type="submit">
</form>

私は私のheader.phpに含まれているjQueryファイルを持っていて、もちろんjQueryライブラリ自身を含んでいます。

jQuery(document).ready(function() {

    jQuery( "#vote_form" ).submit( function( event ) {

        event.preventDefault();

        var id = jQuery("#vote_form #id").val();
        var post_id = jQuery("#vote_form #post_id").val();
        var vote = 'up';

        jQuery.ajax({
            type: "POST",
            url: stn_vote.ajaxurl,
            data: { 
                id: id, 
                post_id: post_id,
                vote: vote, 
                action: 'stn_voting' 
            },

        }); 

    });

});

そして私の投票機能はwp_ajaxアクションにフックしました。

    // Ajax Voting
wp_register_script( 'ajax-vote', get_template_directory_uri() . '/js/ajax-vote.js', array('jquery') );

$nonce = wp_create_nonce("vote_nonce");
$stn_vote_data = array(
    'ajaxurl' => admin_url( 'admin-ajax.php'),
    'nonce' => $nonce,
);
wp_localize_script( 'ajax-vote', 'stn_vote', $stn_vote_data );

function stn_script_enqueuer() {    
    wp_enqueue_script( 'jquery' );
    wp_enqueue_script( 'ajax-vote' );

}
add_action( 'wp_enqueue_scripts', 'stn_script_enqueuer' );

        // Vote Up
        if( isset( $_POST['id'] ) ) {

            //simple Security check
            if ( ! wp_verify_nonce( $_POST['nonce'], 'vote_nonce' ) )
                die ( 'Busted!');

            if( isset( $_POST['post_id'] ) ) {
                $post_id =  $_POST['post_id'];
            }

            if( $_POST['vote'] == 'up' ) {

                $vote_id = $_POST['id'];
                $key = 'vote_up_' . $post_id;
                $vote_up = get_post_meta( $vote_id, $key, true );
                $value = $vote_up + 1;
                $update_vote_up = update_post_meta( $vote_id, 'vote_up_' . $post_id, $value );

                // Update vote count
                $vote_count = get_post_meta( $vote_id, 'vote_count_' . $post_id, true );
                $value = $vote_count + 1;
                $update_vote_count = update_post_meta( $vote_id, 'vote_count_' . $post_id, $value );

                // Update vote percent
                $vote_percent = ( ( $vote_up + 1) / ( $vote_count + 1 ) ) * 100;
                update_post_meta( $vote_id, 'vote_percent_' . $post_id, $vote_percent );

            }

            // Vote Down
            else {          
                $vote_id = $_POST['id'];
                $key = 'vote_down_' . $post_id;
                $vote_down = get_post_meta( $vote_id, $key, true );
                $value = $vote_down + 1;
                $update_vote_down = update_post_meta( $vote_id, 'vote_down_' . $post_id, $value );

                // Update vote count
                $vote_count = get_post_meta( $vote_id, 'vote_count_' . $post_id, true );
                $value = $vote_count + 1;
                $update_vote_count = update_post_meta( $vote_id, 'vote_count_' . $post_id, $value );

                // Update vote percent
                $key = 'vote_up_' . $post_id;
                $vote_up = get_post_meta( $vote_id, $key, true );
                $vote_percent = ( $vote_up / ( $vote_count + 1 ) ) * 100;
                update_post_meta( $vote_id, 'vote_percent_' . $post_id, $vote_percent );

            }
        }
        die();

    }
    add_action('wp_ajax_stn_voting', 'ajax_stn_voting');
    add_action('wp_ajax_nopriv_stn_voting', 'ajax_stn_voting');
2
Robbert

もののカップル:

1:jqueryの後にスクリプトを含めるときは、 wp_localize_script 関数を使用してローカライズします。

$nonce = wp_create_nonce("vote_nonce");
$yourscript_info = array(
    'ajaxurl' => admin_url( 'admin-ajax.php'),
    'nonce' => $nonce
);
wp_localize_script( 'yourscript', 'yourscript', $yourscript_info );

$.ajax({
    type: "POST",
    url: yourscript.ajaxurl,
    data: { id: id, vote: vote, nonce: yourscript.nonce, action: "stn_voting" },

2: ナンス を使用してセキュリティチェックを追加します。

function ajax_stn_voting() {
    //simple Security check
    if ( ! wp_verify_nonce( $_POST['nonce'], 'vote_nonce' ) )
        die ( 'Busted!');

3:投稿IDをメタキーに含める必要はありません。すでに投稿に添付されているので、すでにデータベースに格納されています。

$key = 'vote_up';
instead of
$key = 'vote_up_' . $post->ID;

Vote_upキーだけでなく、すべての_ '。 $ post-> ID;関数内では一部は不要です。すべてのキーが異なる場合は、これらの値に基づいて投稿を並べ替えることはできません。それは、単に不必要なことです。

4:あなたがajaxを使っているとき、あなたは関数の終わりに "死ぬ"必要があります。

    die();
}
add_action('wp_ajax_stn_voting', 'ajax_stn_voting');
add_action('wp_ajax_nopriv_stn_voting', 'ajax_stn_voting');

そうでなければ、スクリプトは私にはよく見えます。

そしてG. M. M.が上記のコメントで言ったこと:)

2
passatgt

あなたのカスタムスクリプトは$を使っているので、 "noConflict"モードを考慮していません。

適切な衝突のないラッパーを使用するか、単に "$"を "jQuery"に置き換えてください。

詳細情報: http://codex.wordpress.org/Function_Reference/wp_enqueue_script#jQuery_noConflict_Wrappers

$ショートカットはすべてのコンテキストで有効ではありません。可能であれば使用を中止するか、またはそのリンクで説明されているようにラッパーを使用して明確に定義する必要があります。

0
Otto