WordPress: PHP Funktion mit Javascript aufrufen

Verbindung zwischen PHP und Javascript

Um die Verbindung zwischen Javascript und PHP herzustellen, sind grundsätzlich drei Codeblöcke notwendig. Verwendet um PHP Funktionen in Javascript auszuführen oder Javascript Variablen zu übersetzen. In diesem Post wird erklärt wie das funktioniert.

Im ersten Teil wird definiert, dass wir eine neue Javascript Datei einbinden und sofort lokalisieren, in unserem Beispiel script-checker.js. In dieser Javascript Datei kann sich anschliessend das jQuery Script befinden.

In erster Linie können so Javascript Inhalte korrekt mit WordPress (PHP) übersetzt werden und gleichzeitig PHP Funktionen über AJAX abgefragt werden. Praktisch und einfach anzuwenden.

Bekanntlich gibt es für Javascript leider keine Übersetzungsmöglichkeit ähnlich wie bei PHP __() und _e() in WordPress. Folglich funktioniert dieser Code als Übersetzungshelfer für Javascript.

Füge diese Funktion in die Hauptdatei deines aktiven Themes oder Plugins ein.

function hook_tschaki_ajax( ){
    wp_enqueue_script( 'script-checker', plugin_dir_url( __FILE__ ) . 'js/script-checker.js' );
    wp_localize_script( 'script-checker', 'account_script_checker', array(
            'ajaxurl' => admin_url( 'admin-ajax.php' ),
            'fail_message' => __('Connection to server failed. Check the mail credentials.', 'script-checker'),
            'success_message' => __('Connection successful. ', 'script-checker')
        )
    );
}
add_action( 'enqueue_scripts', 'hook_tschaki_ajax' );
add_action( 'admin_enqueue_scripts', 'hook_tschaki_ajax' );

Code Definition

Auszuführende PHP Funktion

Gleich unterhalb des neuen Codes wird nun die von Javascript aufzurufende Funktion in PHP deklariert. Zwei Aktionen werden mit der Funktion verbunden:

• wp_ajax_nopriv_check_tschaki_ajax
• wp_ajax_check_tschaki_ajax

nopriv kann verwendet werden, um diese Funktion auch von nicht angemeldeten WordPress Benutzern ausführen zu können.

Der zweite Hook wird nur verwendet, wenn der Benutzer angemeldet ist, also is_user_logged_in() == true zurückgibt. Wäre beispielsweise nützlich bei Funktionen, welche Besucher nicht ausführen sollen.

Füge diese Funktion in die Hauptdatei deines aktiven Themes oder Plugins ein.

function check_tschaki_ajax( ) {
    // insert here your function for ajax request
  	echo 'failed_connection';
}
add_action( 'wp_ajax_nopriv_check_tschaki_ajax', 'check_tschaki_ajax' );
add_action( 'wp_ajax_check_tschaki_ajax', 'check_tschaki_ajax' );

Javascripteinbindung

Mit folgendem Code wird nun die zuvor deklarierte PHP Funktion von Javascript ausgeführt. Die Funktion wird auf Zeile 5 aufgerufen (‚check_tschaki_ajax‚).

Füge den Code in Javascript des aktiven Themes oder Plugins ein.

jQuery.ajax({
        type: 'POST',
        url: account_script_checker.ajaxurl,
        data: {
            action: 'check_tschaki_ajax',
            fail_message: account_script_checker.fail_message,
            success_message: account_script_checker.success_message
        },
        beforeSend: function ( ) {
            jQuery( 'body' ).html( account_script_checker.loading_message );
        },
        success: function ( data, textStatus, XMLHttpRequest ) {
            if( data === 'failed_connection0' ) {
                jQuery( '.checkmailstatus td' ).html( '<div class="error notice"><p>' + account_script_checker.fail_message + '</p></div>' );
            } else {
                jQuery( '.checkmailstatus td' ).html( '<div class="success notice notice-success"><p>' + account_script_checker.success_message + data + '</p></div>' );
            }
        },
        error: function ( XMLHttpRequest, textStatus, errorThrown ) {
            alert( errorThrown );
        }
    });

Angelegte Javascript Variablen sind über WordPress übersetzbar (Zeile 5 und 6 in PHP-Block). Als Ergebnis ist der PHP Code über Javascript aufrufbar.