ajaxurl tidak didefinisikan di ujung depan

25

Saya mencoba membuat ajaxform di sisi depan. Saya menggunakan kodenya

    jQuery.ajax(
        {
            type: "post",
            dataType: "json",
            url: ajaxurl,
            data: formData,
            success: function(msg){
                console.log(msg);
            }
        });

di mana saya mendapatkan kesalahan

Uncaught ReferenceError: ajaxurl is not definedworklorAjaxBookForm @ 
?page_id=2:291onclick @ ?page_id=2:202

Saat menggunakan kode serupa pada karya backend admin. URL apa yang harus saya gunakan untuk memproses permintaan ajax?

dread_cat_pirate
sumber
Lihat tutorial ini. Ini dapat membantu Anda. 1stwebdesigner.com/implement-ajax-wordpress-themes
Nilambar Sharma

Jawaban:

48

Di backend ada ajaxurlvariabel global yang ditentukan oleh WordPress itu sendiri.

Variabel ini tidak dibuat oleh WP di frontend. Ini berarti bahwa jika Anda ingin menggunakan panggilan AJAX di frontend, maka Anda harus mendefinisikan variabel tersebut sendiri.

Cara yang baik untuk melakukannya adalah menggunakan wp_localize_script.

Anggap saja panggilan AJAX Anda ada dalam my-ajax-script.jsfile, lalu tambahkan wp_localize_script untuk file JS ini seperti ini:

function my_enqueue() {

    wp_enqueue_script( 'ajax-script', get_template_directory_uri() . '/js/my-ajax-script.js', array('jquery') );

    wp_localize_script( 'ajax-script', 'my_ajax_object',
            array( 'ajax_url' => admin_url( 'admin-ajax.php' ) ) );
}
add_action( 'wp_enqueue_scripts', 'my_enqueue' );

Setelah melokalkan file JS Anda, Anda dapat menggunakan my_ajax_objectobjek di file JS Anda:

jQuery.ajax(
    {
        type: "post",
        dataType: "json",
        url: my_ajax_object.ajax_url,
        data: formData,
        success: function(msg){
            console.log(msg);
        }
    });
Krzysiek Dróżdż
sumber
2
dapatkah saya menggunakan wp_localize_scripttanpa harus menggunakan wp_enqueue_scritp?
dread_cat_pirate
1
Anda menggunakan pegangan skrip di wp_localize_script, jadi Anda harus menggunakan wp_enqueue_script untuk setidaknya satu dari skrip Anda. Tapi ... Tidak menggunakan wp_enqueue_script bukan ide yang baik (Anda berisiko mengalami beberapa konflik dan masalah dependensi).
Krzysiek Dróżdż
saya tidak punya skrip eksternal untuk dimuat, saya hanya ingin menggunakan ajaxurl untuk melakukan panggilan ajax. Apakah itu tidak mungkin?
RT
Dan di mana Anda akan menelepon AJAX ini? Sebagai skrip sebaris? Itu ide yang sangat buruk ...
Krzysiek Dróżdż
Saya memiliki formulir terpisah, dalam hal ini saya sedang mengelola validasi dan mengirimkan, panggilan ajax untuk mengirimkan formulir dengan cara wordpress saja dengan menambahkan hook. Lagi pula saya sudah menemukan cara untuk menggunakan ajaxurl.
RT
33

untuk menggunakan ajaxurl secara langsung, di file plugin Anda tambahkan ini:

add_action('wp_head', 'myplugin_ajaxurl');

function myplugin_ajaxurl() {

   echo '<script type="text/javascript">
           var ajaxurl = "' . admin_url('admin-ajax.php') . '";
         </script>';
}

Anda kemudian dapat menggunakan ajaxurluntuk permintaan ajax.

RT
sumber
1
Jawaban ini membuat ajaxurlsama dengan penggunaan standar. Yang jauh lebih baik daripada jawaban yang diterima.
Abel Melquiades Callejo
benar, tetapi tidak berguna jika Anda menggunakannya dalam file .js.
Jules
1
@ Jules ajaxurlmasih tersedia dalam *.jsfile. Untuk melakukannya, Anda mungkin perlu mendeklarasikan ajaxurlvariabel sejak awal pemuatan halaman. Hal lain yang perlu dipertimbangkan adalah pemanggilan *.jsfile eksternal Anda. File eksternal harus disebut SETELAH yang ajaxurltelah dipakai dan diberi nilai URL yang tepat.
Abel Melquiades Callejo