tschaki
WordPress Shortcode erstellen
Home » WordPress: PHP Funktion mit Javascript aufrufen

WordPress: PHP Funktion mit Javascript aufrufen

Mit Wordpress ist es möglich, PHP-Funktionen über Javascript oder jQuery auszuführen. Bei richtiger Anwendung werden alle Parameter und Variablen übertragen und sind übersetzbar.

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

ZeileBeschreibung
1.Funktion ‘hook_tschaki_ajax()‘ wird erstellt.
2.script-checker.js wird als (leere) Datei eingehängt.
3.AJAX URL wird mit Funktion für JS (account_script_checker) deklariert. Handle “script-checker” muss hierbei auf Zeile 2 und 3 vorhanden sein.
4.Beinhaltet die Standard AJAX URL von WordPress admin-ajax.php.
5./6.Übersetzbare Strings oder Werte für Javascript Ausführung.
10.Hänge die Funktion ins WordPress Frontend als Javascript ein. (Benutzung von Ajax im Frontend)
11.Hänge die Funktion ins WordPress Backend als Javascript ein. (Benutzung von Ajax im Backend)

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.

Trent Bojett

My name is Trent Bojett, I am 28 years old and I live in Switzerland. Because of my enthusiasm for writing and the logical world (= software development) I started this blog in early 2020.

Kommentieren