WordPress: wie Sie eine plugin-Funktion mit ajax-call?

Schreibe ich eine WordPress MU plugin, enthält es einen link, der mit jeder post, und ich will ajax verwenden, um rufen Sie eine der plugin-Funktionen, wenn der Benutzer auf diesen link klickt, und dann dynamisch zu aktualisieren, die den link-text mit der Ausgabe von dieser Funktion.

Bin ich stecken mit der ajax-Abfrage. Ich habe das zu kompliziert, klar hack-ish, Weg, es zu tun, aber es ist nicht ganz arbeiten. Was ist der 'richtige' oder 'wordpress' mit ajax-Funktionalität in ein plugin?

(Meine aktuellen hack-code ist unten. Wenn ich auf den link habe ich nicht bekommen, die gleiche Ausgabe bekomme ich in der wp-Seite, wie wenn ich direkt zu sample-ajax.php in meinem browser.)

Ich habe meinen code[1] wie folgt festgelegt:

mu-plugins/sample.php:

<?php
/*
Plugin Name: Sample Plugin
*/
if (!class_exists("SamplePlugin")) {
  class SamplePlugin {
    function SamplePlugin() {}
    function addHeaderCode() {
      echo '<link type="text/css"  href="'.get_bloginfo('wpurl').
             '/wp-content/mu-plugins/sample/sample.css" />\n';
      wp_enqueue_script('sample-ajax', get_bloginfo('wpurl') .
             '/wp-content/mu-plugins/sample/sample-ajax.js.php',
             array('jquery'), '1.0');

    }
    //adds the link to post content.
    function addLink($content = '') {
        $content .= "<span class='foobar clicked'><a href='#'>click</a></span>";
        return $content;
    }
    function doAjax() { //
        echo "<a href='#'>AJAX!</a>";
    } 
  }
}
if (class_exists("SamplePlugin")) {
  $sample_plugin = new SamplePlugin();
}
if (isset($sample_plugin)) {
  add_action('wp_head',array(&$sample_plugin,'addHeaderCode'),1);
  add_filter('the_content', array(&$sample_plugin, 'addLink'));
}

mu-plugins/sample/sample-ajax.js.php:

<?php
if (!function_exists('add_action')) {
    require_once("../../../wp-config.php");
}
?>
jQuery(document).ready(function(){
    jQuery(".foobar").bind("click", function() {
        var aref = this;
        jQuery(this).toggleClass('clicked');
        jQuery.ajax({
          url: "http://mysite/wp-content/mu-plugins/sample/sample-ajax.php",
          success: function(value) {
            jQuery(aref).html(value);
          }
        });
    });
});

mu-plugins/sample/sample-ajax.php:

<?php
if (!function_exists('add_action')) {
  require_once("../../../wp-config.php");
}
if (isset($sample_plugin)) {
  $sample_plugin->doAjax();
} else {
  echo "unset";
}
?>

[1] Hinweis: Das folgende tutorial hat mich dies weit, aber ich bin ratlos an dieser Stelle.
http://www.devlounge.net/articles/using-ajax-with-your-wordpress-plugin

InformationsquelleAutor Bee | 2010-05-25

22

TheDeadMedic ist nicht ganz richtig. WordPress hat integrierte AJAX-Funktionen. Senden Sie Ihre ajax-request /wp-admin/admin-ajax.php mit Hilfe des POST-mit dem argument, 'action':
```
jQuery(document).ready(function(){
    jQuery(".foobar").bind("click", function() {
        jQuery(this).toggleClass('clicked');
        jQuery.ajax({
          type:'POST',
          data:{action:'my_unique_action'},
          url: "http://mysite/wp-admin/admin-ajax.php",
          success: function(value) {
            jQuery(this).html(value);
          }
        });
    });
});
```
Dann Haken Sie es in der plugin wie dieses, wenn Sie nur wollen, dass es funktioniert für angemeldete Benutzer:
```
add_action('wp_ajax_my_unique_action',array($sample_plugin,'doAjax'));
```
oder Haken, wie diese arbeiten nur für nicht-angemeldete Benutzer:
```
add_action('wp_ajax_nopriv_my_unique_action',array($sample_plugin,'doAjax'));
```
Verwenden Sie beide, wenn Sie wollen, dass es Arbeit für alle.

admin-ajax.php verwendet einige action-Namen bereits, so stellen Sie sicher, Sie schauen Sie durch die Datei und verwenden Sie nicht die gleiche Aktion Namen, sonst werden Sie versehentlich versuchen, Dinge zu tun, wie das löschen von Kommentaren, etc.

BEARBEITEN

Sorry, ich habe nicht ganz verstanden die Frage. Ich dachte, du fragst, wie man ein ajax-request. Trotzdem, zwei Dinge, die ich versuchen würde:

Ersten, haben Ihre Funktion echo nur das Wort AJAX ohne a tag. Als Nächstes versuchen Sie, Ihre ajax-Aufruf, so dass es sowohl ein Erfolg und ein vollständiges callback:
```
jQuery(document).ready(function(){
    jQuery(".foobar").bind("click", function() {
        var val = '';
        jQuery(this).toggleClass('clicked');
        jQuery.ajax({
          type:'POST',
          data:{action:'my_unique_action'},
          url: "http://mysite/wp-admin/admin-ajax.php",
          success: function(value) {
            val = value;
          },
          complete: function(){
            jQuery(this).html(val);
          }
        });
    });
});
```
Ich vergaß hinzuzufügen, dass admin-ajax.php kümmert sich um das laden der gesamten WordPress-Umgebung, so dass Sie nicht brauchen, zu kümmern, einschließlich aller Dateien in dem plugin.
Ihre ursprüngliche Antwort war toll. Vielen Dank für zeigt mir den richtigen Weg zu tun, ajax in wp. Deine Erklärung macht klar, was ich gesehen habe in anderen code, den ich gelesen habe. Hinweis: ich hatte auch einen javascript scoping-Fehler, den ich oben berichtigt in Frage, und so könnte es ein nützlicher wp-Referenz-Frage als ein "fix my bestimmten dumme Fehler' Frage. (verweist 'this' innerhalb der Erfolg der fn für den ajax-call).
John S. ist tot Recht, ich entschuldige mich, meine Lösung ist nicht die einzige Möglichkeit, aber es ist eine Methode, die ich finden einfach, schnelle AJAX, ohne laden zu müssen WordPress selbst.
Vergaß zu erwähnen, in John P ' s Methode, die Sie verwenden können, die JavaScript-variable ajaxurl statt hardcoding die URL (oder die Eigenschaft userSettings.ajaxurl in WP 3.0).
Wo sollte ich die jQuery-Funktion ?, in welche Datei ?

InformationsquelleAutor John P Bloch

WordPress-Umgebung

Erstens, um zu erreichen diese Aufgabe, ist es empfehlenswert, sich zu registrieren, dann enqueue-ein jQuery-Skripts, die push-Anfrage an den server. Diese Vorgänge werden eingehakt wp_enqueue_scripts action hook. In der gleichen Haken sollte man wp_localize_script dass es verwendet, um beliebigen Javascript-Code. Durch diese Möglichkeit wird es ein JS-Objekt zur Verfügung im front-end. Dieses Objekt führt auf die richtige url verwendet werden, durch die jQuery-handle.

Werfen Sie bitte einen Blick auf:

- Datei: functions.php 1/2

add_action( 'wp_enqueue_scripts', 'so_enqueue_scripts' );
function so_enqueue_scripts(){
  wp_register_script( 'ajaxHandle', get_template_directory() . 'PATH TO YOUR JS FILE', array(), false, true );
  wp_enqueue_script( 'ajaxHandle' );
  wp_localize_script( 'ajaxHandle', 'ajax_object', array( 'ajaxurl' => admin_url( 'admin-ajax.php' ) ) );
}

- Datei: jquery.ajax.js

Diese Datei lässt den ajax-call.

jQuery(document).ready( function($){
  //Some event will trigger the ajax call, you can push whatever data to the server, simply passing it to the "data" object in ajax call
  $.ajax({
    url: ajax_object.ajaxurl, //this is the object instantiated in wp_localize_script function
    type: 'POST',
    data:{
      action: 'myaction', //this is the function in your functions.php that will be triggered
      name: 'John',
      age: '38'
    },
    success: function( data ){
      //Do something with the result from server
      console.log( data );
    }
  });
});

- Datei: functions.php 2/2

Endlich auf Ihre functions.php die Datei sollte es sein, die Funktion, die ausgelöst durch Ihre ajax-call.
Denken Sie daran die Suffixe:

wp_ajax ( ermöglichen die Funktion nur für registrierte user oder admin-panel-Operationen),
wp_ajax_nopriv ( die Funktion ermöglichen für die keine Berechtigung Benutzer )

Diese Suffixe plus die Aktion verfassen Sie den Namen Ihrer Aktion:

wp_ajax_myaction oder wp_ajax_nopriv_myaction

add_action( 'wp_ajax_myaction', 'so_wp_ajax_function' );
add_action( 'wp_ajax_nopriv_myaction', 'so_wp_ajax_function' );
function so_wp_ajax_function(){
  //DO whatever you want with data posted
  //To send back a response you have to echo the result!
  echo $_POST['name'];
  echo $_POST['age'];
  wp_die(); //ajax call must die to avoid trailing 0 in your response
}

Hoffe, es hilft!

Lassen Sie mich wissen, wenn etwas nicht klar ist.

add_action( 'wp_ajax_nopriv_myaction', 'so_wp_ajax_function' );

InformationsquelleAutor rams0610

Nur um eine information.
Wenn Sie erhalten möchten ein Objekt aus einer php-Klasse, Methode, Funktion :

js-Datei

jQuery(document).ready(function(){
jQuery(".foobar").bind("click", function() {
    var data = {
        'action': 'getAllOptionsByAjax',
        'arg1': 'val1',
        'arg2': $(this).val() 
    };
    jQuery.post( ajaxurl, data, function(response) {
       var jsonObj = JSON.parse( response );
    });
});

php-Datei

public static function getAllOptionsByAjax(){

    global $wpdb;

    //Start query string
    $query_string  =  "SELECT * FROM wp_your_table WHERE col1='" . $_POST['arg1'] . "' AND col2 = '" . $_POST['arg2'] . "' ";

    //Return results
    $a_options = $wpdb->get_results( $query_string, ARRAY_A );
    $f_options = array();
    $f_options[null] =  __( 'Please select an item', 'my_domain' );
    foreach ($a_options as $option){
        $f_options [$option['id']] = $option['name'];
    }
    $json = json_encode( $f_options );
    echo $json;
    wp_die();
}

InformationsquelleAutor J.BizMai

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.