web-dev-qa-db-ja.com

jquery ajaxを介して呼び出されたときにwp_localize_scriptが定義されていない

私は私のajaxリクエストを動かすのに苦労しています。 $ajaxを起動すると失敗し、このエラーが表示されます。

参照されていないReferenceError：feature_ajaxが定義されていない

これは私のfunctions.phpです

// load our frontend modifiers
require_once(__DIR__ . '/lib/Frontend.lib.php');

これは私のFrontend.lib.phpクラスのphpです...

class Frontend
{

    /** frontend constructor */
    public function __construct()
    {

        // enqueue our scripts
        add_action('wp_enqueue_scripts', array($this, 'action_wp_enqueue_scripts'));

        // add out ajax actions
        $this->ajax_actions();

    }

    /** frontend enqueued scripts */
    public function action_wp_enqueue_scripts()
    {

        // localize admin ajax
        wp_localize_script('ajax-actions', 'ajax_actions', array(
            'ajaxurl' => admin_url( 'admin-ajax.php' )
        ));

        // enqueue scripts
        wp_enqueue_script('ajax-actions');

    }


    /** ajax actions */
    public function ajax_actions()
    {

        // admin field postdata ajax actions
        add_action('wp_ajax_field_postdata', [__CLASS__, 'field_postdata']);

        // public field postdata ajax actions
        add_action('wp_ajax_nopriv_field_postdata', [__CLASS__, 'field_postdata']);

    }

    // Field Post Data
    public static function field_postdata()
    {
        global $post;
        $post_id = ($_REQUEST['id']);

        if($post_id){
            $post = get_post($post_id);
            setup_postdata($post);
            get_template_part('ajax/modal','field');
            die();
        }

    }

}

new Frontend();

以下の$ajaxスクリプトを起動すると、エラー feature_ajaxが定義されていません が発生します。

しかし、それは上記のコードで定義されています。

以下のこのスクリプトは私のtheme-min.jsファイルです

// load feature post data
$.ajax({
    cache: false,
    timeout: 8000,
    url: ajax_actions.ajaxurl,
    type: 'POST',
    data: {
        action: 'field_postdata',
        id: post_id
    },
    success: function (data) {
        alert(data);
    }
});

私が悪いことをしていることを理解するのを手伝っていただければ幸いです。

ありがとう

修正された固定コード

だから私はこの仕事をするために変更しました。私はすでにmain-min.jsファイルをエンキューしていたので、エンキューされたjavascriptと同じハンドルを使ってwp_localize_scriptを結合しましたが、うまくいきました。

// register js in footer
$filename = get_template_directory_uri() . '/assets/scripts/main-min.js';
wp_register_script('main-js', $filename, array(), Rand(), true);

// localize theme-js ajax actions
wp_localize_script('main-js', 'ajax_actions', array(
    'ajaxurl' => admin_url( 'admin-ajax.php' )
));

// enqueue required scripts
wp_enqueue_script('main-js')
wp-localize-script
3
joshmoto

wp_localize_scriptを介してwindowオブジェクトに変数を正しく追加するには、次の順序で3つの関数を正しく呼び出す必要があります。

  1. wp_register_script

  2. wp_localize_script

  3. wp_enqueue_script

あなたの場合はwp_register_scriptがありません。誰かが同じ問題を経験した場合、以下のコード手順に従ってください。

_ php _ 

<?php
    function my_theme_wp_enqueue_scripts() {
        $handle = 'my_handle';

        // Register the script
        wp_register_script($handle, '/path/to/my_script.js');

        // Localize the script with a new data
        wp_localize_script($handle, 'object_name', [
            'ajax_url' => admin_url('admin-ajax.php')
        ]);

        // Enqueue the script
        wp_enqueeu_script($handle);
    }
    add_action('wp_enqueue_scripts', 'my_theme_wp_enqueue_scripts');

その後、 Javascript にあるローカライズされたオブジェクトにアクセスできます。

var ajax_url = object_name.ajax_url;
console.log(ajax_url);

アプリケーションにとって意味のある _ php _ の$handleと同様に、object_name変数の内容を変更します。

3
Den Isahac