Belajar Menggunakan Ajax pada Wordpress


Tidak asing dengan kata - kata ajax, bagi yang pernah memakainya pasti sudah tidak asing lagi, namun untuk pemula untuk mendengar saja jarang apalagi untuk memakainya, karna cukup jarang website yang menonjolkan pemakaian ajax, jadi cukup jarang bagi pemula yamg memperhatikan.

Lalu apa sih ajax, AJAX adalah teknologi berbasis JavaScript yang memungkinkan halaman web untuk mengambil informasi baru dan muncul dengan sendirinya tanpa harus merefresh halaman.

Namun disini saya akan berbagi menggunakan ajax dengan bantuan cms Wordpress.

Pertama kita harus mengambil url ajax yang ada di Wordpress,

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

Setelah kita mendapatkan urlnya jangan lupa kita juga membutuhkan JQuery untuk kode ajax nanti.

kita buat kode html nya dulu.


<a href="#" id="#submit">AJAX</a>
<div id="#tempat-ajax"></div>

Kode diatas tersebut adalah pemicunya jika nanti AJAX di klick maka akan menjalan fungsi dan mengisi div yang ber ID kan tempat-ajax tersebut.

Lalu kita buat fungsinya

<script>
    jQuery(document).ready(function($) {
    
        function my_ajax() {
            var data = {
                'action': 'get_my_ajax'
            };
            
            $.post(ajaxurl, data, function(response) {
                $( "#tempat-ajax" ).html(response);
            });
        }
        
        
        $("#submit").on('click', function (e) {
            e.preventDefault();
            my_ajax();
        });
        
    });
</script>

setelah fungsi javascript selesai kita buat fungsi PHP nya.


<?php
add_action('wp_ajax_get_my_ajax', 'my_ajax_php');
add_action('wp_ajax_nopriv_get_my_ajax', 'my_ajax_php');
function my_ajax_php(){

    echo 'my ajax berhasil';
    
    die;
}
?>

SELAMAT MENCOBA !!