AJAX mit PHP-Datei in Wordpress Plugin

Question

Ich befolge ein Tutorial auf W3Schools für AJAX PHP. https://www.w3schools.com/php/php_ajax_php.asp

Hier ist der Dreh: Ich mache das in WordPress. Das Folgende ist eine Methode, die funktioniert, aber es ist weniger als ideal.

1) Erstellen Sie die folgende gethint.php im Stammverzeichnis.

<?php 
// Array with names 
$a[] = "Anna"; 
$a[] = "Brittany"; 
... 
$a[] = "Vicky"; 

// get the q parameter from URL 
$q = $_REQUEST["q"]; 

$hint = ""; 

// lookup all hints from array if $q is different from "" 
if ($q !== "") { 
    $q = strtolower($q); 
    $len=strlen($q); 
    foreach($a as $name) { 
     if (stristr($q, substr($name, 0, $len))) { 
      if ($hint === "") { 
       $hint = $name; 
      } else { 
       $hint .= ", $name"; 
      } 
     } 
    } 
} 

// Output "no suggestion" if no hint was found or output correct values 
echo $hint === "" ? "no suggestion" : $hint; 

2) Mit der CSS & Javascript Toolbox-Plugin, fügen Sie diesen Code in die Kopfzeile:

<script> 
function showHint(str) { 
    if (str.length == 0) { 
     document.getElementById("txtHint").innerHTML = ""; 
     return; 
    } else { 
     var xmlhttp = new XMLHttpRequest(); 
     xmlhttp.onreadystatechange = function() { 
      if (this.readyState == 4 && this.status == 200) { 
       document.getElementById("txtHint").innerHTML = this.responseText; 
      } 
     }; 
     xmlhttp.open("GET", "/gethint.php?q=" + str, true); 
     xmlhttp.send(); 
    } 
} 
</script> 

3) Erstellen Sie eine Seite mit dem folgenden Code (im Klartext):

<p><b>Start typing a name in the input field below:</b></p> 
<form> 
First name: <input type="text" onkeyup="showHint(this.value)"> 
</form> 
<p>Suggestions: <span id="txtHint"></span></p> 

Während dies funktioniert, scheint eine PHP-Datei zu erstellen und zum Root-Verzeichnis hinzufügen, wie schlechte Praxis. Es wäre besser, wenn diese PHP-Datei im Plugins-Verzeichnis gespeichert wäre. Jedoch, die bewirkt, dass diese Zeile des Headers Skript als 404 zum Scheitern verurteilt:

xmlhttp.open("GET", "/gethint.php?q=" + str, true); 

einfach den relativen Pfad zu ändern wird nicht funktionieren, weil theoretisch verschiedene Benutzer können ihre Plugin-Ordner in verschiedenen Orten haben.

Ich denke, ich sollte die wp_ajax_ und wp_ajax_nopriv_ Haken verwenden, aber meine Versuche habe ich gescheitert, also mache ich es wahrscheinlich falsch. Bitte helfen Sie.

Answer 1

tun ajax in Wordpress sollten alle zu /wp-admin/admin-ajax.php gesendet werden, , das zu tun, in Ihrem Plugin-Hauptdatei oder die index.php Datei, Ihre Ajax-Aktion wie folgt registrieren:

// let's do the ajax thing here 
add_action('wp_ajax_theNameOfMyCustomAjax', 'theFunctionThatMyAjaxWillCall'); 

function theFunctionThatMyAjaxWillCall() { 
    // include your ajax file here, in this case 
    // I assumed that we placed the gethint.php in 
    // /wp-content/plugins/yourpluginname/gethint.php 
    include(plugin_dir_path(__FILE__).'gethint.php'); 

    // don't forget to add "die;" every time you return a response to your ajax 
    //Example: echo $hint === "" ? "no suggestion" : $hint; die; 

    // or you can add the termination code right here 
    die; // this will prevent the ajax response to have 0 in the end. 

} 

nun in Ihrem javascript anstatt den Dateinamen Ihres ajax-Datei aufrufen, können Sie jetzt die globale ajaxurl verwenden javaScript-Variable wie folgt aus:

xmlhttp.open("GET", ajaxurl+"?action=theNameOfMyCustomAjax&q=" + str, true);