Bart SalléFreelance webdeveloper Plan een gesprek
Javascript

WordPress plugin development: Ajax gebruiken

WordPress plugin development: Ajax gebruiken

Stel dat je een WordPress plugin hebt ontwikkeld die een eigen beheerpagina heeft in de WordPress backend. En stel dat je door middel van een button via Ajax een php functie van je plugin wilt laten uitvoeren. Dat doe je in drie simpele stappen!

Stap 1, creëer de button

<button id="trigger"></button>

Stap 2, creëer de (callback) functie en hook deze aan de WordPress AJAX functionaliteit

In je plugin file plaats je de functie die output genereert.

function mijnQuery($parameter1, $parameter2, $parameter3) {
    ...
    return $output;
}

Door je functie aan de juiste hook te koppelen maak je deze beschikbaar voor een AJAX call.

Deze hook is alleen voor de WordPress backend:

add_action( 'wp_ajax_mijnQuery', 'mijnQuery' );

Wil je AJAX functionaliteit voor de WordPress frontend implementeren, gebruik dan deze hook:

add_action( 'wp_ajax_nopriv_mijnQuery', 'mijnQuery' );

Stap 3, maak de call via javascript

jQuery('#trigger').click(function(){
    $.ajax({
        url: ajaxurl, // Sinds WP 2.8 ajaxurl is altijd beschikbaar en verwijst naar adminajax.php
        data: {
            'action':'mijnQuery' // Dit is onze functie uit stap 2
        },
        success:function(data) {
            // Deze geeft de output van de resultaten van onze AJAX request (de callback)
            window.alert(data);
        },
        error: function(errorThrown){
            window.alert(errorThrown);
        }
    });
});
Vraag advies over dit onderwerp
Bricks Builder

Maak een rollover productafbeelding zonder plugin te gebruiken

4 november 2024 Lees meer
Algemeen

Ik wil web developer worden maar welke opleiding of cursus kan ik dan het beste volgen?

25 september 2022 Lees meer
PHP

Class gebruiken in een WordPress plugin

9 oktober 2021 Lees meer