• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

XMLHttpRequest

Markus1965

Neues Mitglied
Hallo in die Runde,

ich kämpfe seit Stunden mit einem XMLHttpRequest. Ich möchte ähnlich wie in jQuery (aber ohne den ganzen Balast) eine Funktion schreiben, die mir einen post-Befehl ausführt. Dazu habe ich die übliche XMLHttpRequest-Funktion verwendet. Anders als in allen Anleitungen zu finden, möchte ich aber die Antwort aus dem Request als Variable zurückbekommen.
Ich bekomme aber leider immer nur entweder ein "undefined" oder einen leeren String zurück. Selbst wenn ich die Variable schon ausserhalb der Funktion deklariere damit sie global gültig wird.
Hier mein Code:
<div class="spaceL"> <button onclick="testButton()">Test laden</button> <p id="infoText">&nbsp;</p> </div> <script> answ=""; function testButton(){ let antwort = post('funktion=test'); //post('funktion=test'); //alert(antwort); document.getElementById('infoText').innerHTML = antwort; } function post(x){ var request = new XMLHttpRequest(); request.open("POST","../dispatcher.php"); request.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); request.addEventListener('load', function(event) { if (request.status >= 200 && request.status < 300) { console.log('Antwort-1: '+request.responseText); answ = request.responseText;//'Test'; //document.getElementById('infoText').innerHTML = 'Antwort: '+answ; return answ; } else { console.warn(request.statusText, request.responseText); } }); request.send(x); console.log('Antwort-2: '+request.responseText); return answ; }
Antwort-1 = wie erwartet aus der PHP-Datei
Antwort-2 = leer
id="infoText" = leer

Warum wird die Variable "answ" nicht per return answ; zurückgeliefert?

Vielen Dank im Voraus

Markus
 
Werbung:
kannst du mal die php datei posten ?
Bzw was du von php zurück bekommen willst.?
Außerdem vermisse ich deinen post Inhalt.
Ich meine damit das du doch irgendwas an das php Script senden willst oder nicht ?
 
Hallo Basti,

das PHP-Script gibt einfach nur ein "echo 'Test erfolgreich';" zurück. Dieses wird als Antwort-1 auc in der Konsole angezeigt.
 
Werbung:
Ich habe das mal so versucht

HTML:
<div class="spaceL">
    <button id="testButton">Test laden</button>
    <p id="infoText">&nbsp;</p>
</div>

<script>

document.getElementById('testButton').addEventListener('click',function(){

let wert1='name';
let wert1_value='Peter';
let wert2='nachname';
let wert2_value='mueller';

//ajax('http://www.google.com'); // bei get
var antwort = ajax('dispatcher.php', 'POST', wert1+'='+wert1_value+'&'+wert2+'='+wert2_value);
    document.getElementById('infoText').innerHTML = antwort;

});

function ajax(url, method, data, async) {
    method = typeof method !== 'undefined' ? method : 'GET';
    async = typeof async !== 'undefined' ? async : false;

    if (window.XMLHttpRequest) {
         var xhReq = new XMLHttpRequest();
    } else{
         var xhReq = new ActiveXObject("Microsoft.XMLHTTP");
    }

    if (method == 'POST') {
     xhReq.open(method, url, async);
     xhReq.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
     xhReq.setRequestHeader("X-Requested-With", "XMLHttpRequest");
     xhReq.send(data);
    } else {
     if(typeof data !== 'undefined' && data !== null) {
          url = url+'?'+data;
     }
     xhReq.open(method, url, async);
     xhReq.setRequestHeader("X-Requested-With", "XMLHttpRequest");
     xhReq.send(null);
    }
    return xhReq.responseText;

}
</script>
Das Php dahinter sieht so aus
PHP:
<?php

if(isset($_POST['name'])){
$name=htmlspecialchars($_POST['name']);

}
if(isset($_POST['nachname'])){
$nachname=htmlspecialchars($_POST['nachname']);

}

echo "Guten Tag<br>Dein Name ist $name.<br>Dein Nachname ist $nachname.<br>Vielen Dank für deine Post Anfrage";

?>
Ausgabe was zurückkommt
Guten Tag
Dein Name ist Peter.
Dein Nachname ist mueller.
Vielen Dank für deine Post Anfrage
Denke mal das du damit deinen Code hinbekommen kannst.
Edit: Sorry andreas du wahrst schneller.Mit fetch wäre natürlich noch nee bessere Variante.
 
Werbung:
Diese art von Requesten habe ich damals noch mit Greasemonkey gemacht , da sah sowas noch so aus ungefähr
Code:
GM_xmlhttpRequest({
      method: 'POST',
      url: 'php_script.php',
      headers: {'Content-type': 'application/x-www-form-urlencoded'},
      data: encodeURI('name=peter&nachname=mueller'),
      onload: function(responseDetails){
            console.log(responseDetails);
      }
});
Nachdem ich aber mit Jquery Ajax angefangen habe nutze ich das eigentlich nur noch ( auch bei GM ).
Ich finde das einfacher.Ich kann den TO ja verstahen das er das alles ohne den Jquery kram machen will.

Mit der fetch Api habe ich so noch nicht gearbeitet, habe aber bei sempervivum schon öffters Themen mitgelesen wo das alles zimlich einfach sein soll und auch besser klappt usw.
 
Zurück
Oben