Antworten auf deine Fragen:
Neues Thema erstellen

Antworten zum Thema „Wordpress jQuery Ajax Request und Ausgabe im Footer“

afr0kalypse

Allwissendes Karmameerschweinchen!

Hi. Ich möchte per eigenem jQuery Script einen Wert ermitteln und diesen im Footer meiner Seite anzeigen oder zwischenspeichern. Das Ganze soll für mein Wordpress Theme funktionieren.

Als Ergebnis möchte ich erreichen, dass ich in Wordpress eine Funktion device_size() habe, die ich irgendwo aufrufen kann und die mir als Rückgabewert den ermittelten Wert aus meinem jQuery Script anzeigt. Diesen möchte ich später als Thumbnail Argument nutzen.

Dazu muss ich in der functions.php mein Script einqueuen und einen wp_ajax_* Filter hooken. Habe ich gemacht. Allerdings habe ich nun 1 Fehler und ein Verständnisproblem.
Zuerst der Code:
functions.php
PHP:
/**
*    Make use of jQuery and responsive_images Script
*/
add_action( 'wp_enqueue_scripts', 'dav2_enqueue_scripts' );
function dav2_enqueue_scripts(){
  wp_enqueue_script('jquery');
  wp_register_script( 'responsive_images', get_template_directory_uri() . '/js/responsive_images.js', array('jquery'), false, true );
  wp_enqueue_script( 'responsive_images' );
  wp_localize_script( 'responsive_images', 'MyAjax', array( 'ajaxurl' => admin_url( 'admin_ajax.php' ) ) );
}

/**
*    Check the device size
*/
add_action('wp_ajax_dav2_device_size', 'dav2_device_size');
add_action('wp_ajax_nopriv_dav2_device_size', 'dav2_device_size');
function dav2_device_size() {  
    if(isset($_POST['device_size'])) {
        echo $_POST['device_size'];
    } else {
        echo "NIX";
    }
    exit;
}

responsive_images.js
PHP:
jQuery(document).ready(function($) {
    var data = {
        action: 'dav2_device_size',
        device_size: function(){
            if (window.matchMedia("all and (max-width: 480px)").matches) {
                return "responsive_small";
            }
            else if (window.matchMedia("all and (min-width: 480px) and (max-width: 800px)").matches) {
                return "responsive_medium";
            } else {
                return "responsive_large";
            }
        }    
    };
    // We can also pass the url value separately from ajaxurl for front end AJAX implementations
    jQuery.post(MyAjax.ajaxurl, data, function(response) {
        alert(response);      
    })
    .fail(function() {
        alert( "error" );
    });
});

Im Footer mache ich erstmal einfach nur
PHP:
<?php print_r($_POST, false); ?>

Der Fehler:
im jQuery Script lande ich in der fail Funktion, wenn ich die Seite aufrufe.
Ändere ich den jQuery.post von jQuery.post(MyAjax.ajaxurl .... auf jQuery.post(MyAjax.ajax_url ... lande ich im success und mir wird die Response als Alert ausgegeben. Wieso???? In der functions.php steht in wp_localize_script doch auch array( 'ajaxurl' ...) und nicht array( 'ajax_url' ...)

zur Verständnisfrage:
Ich muss den Kram ja mit wp_ajax_nopriv_* hooken um den weiterverarbeiten zu können. Hier scheinen aber nie Daten zu landen. Ich kann die nicht abfangen, nicht per global $wpdb in die DB schreiben... die Post Variablen sind immer leer... wie komme ich nun an den Wert von device_size heran?

Ich hoffe mir kann wer helfen...
VG
 

afr0kalypse

Allwissendes Karmameerschweinchen!

Also ich habe noch ein wenig rum probiert und konnte nun immerhin meine Daten, die ich per jQuery generiere, als POST Variablen darstellen. Allerdings scheint die Seite nun in einer Ajax Schleife zu hängen. Die Seite läd nämlich ununterbrochen weiter, auch wenn die Daten richtig angezeigt werden...

PHP:
$.post(MyAjax.ajax_url, data, function(response) {       
        document.write(response);
}) ....

Ich muss doch irgendwie diesen Wert aus device_size weiterverarbeiten können :(
 

afr0kalypse

Allwissendes Karmameerschweinchen!

Und noch mal ich.
Der Fehler war, dass ich admin_ajax.php aufrufen wollte aber admin-ajax.php die richtige Datei ist.
Aber scheinbar kommt mir trotzdem der asynchrone Aufruf in die Quere...

PHP:
...
if($_POST['device_size'] == 'responsive_large') {   
    add_image_size('responsive_large', 800, 9999);
    echo 'BLA';
} else {   
    echo 'error error';
}
Ich dachte mir, dass ich so zuerst prüfen kann, welche Device Größe ich habe und erstelle dann eine neue Thumbnail Größe.
Diese wird aber nicht erstellt, bzw ist scheinbar nach dem Javascript Aufruf nicht mehr vorhanden...

Hat jemand ne Idee, wie ich nun diese Bildergröße noch registriert kriege?
 
Bilder bitte hier hochladen und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.
Antworten auf deine Fragen:
Neues Thema erstellen

Willkommen auf PSD-Tutorials.de

In unseren Foren vernetzt du dich mit anderen Personen, um dich rund um die Themen Fotografie, Grafik, Gestaltung, Bildbearbeitung und 3D auszutauschen. Außerdem schalten wir für dich regelmäßig kostenlose Inhalte frei. Liebe Grüße senden dir die PSD-Gründer Stefan und Matthias Petri aus Waren an der Müritz. Hier erfährst du mehr über uns.

Stefan und Matthias Petri von PSD-Tutorials.de

Nächster neuer Gratisinhalt

03
Stunden
:
:
25
Minuten
:
:
19
Sekunden

Flatrate für Tutorials, Assets, Vorlagen

Statistik des Forums

Themen
175.155
Beiträge
2.581.856
Mitglieder
67.222
Neuestes Mitglied
Gregor
Oben