✔ JQuery und Ajax (JSON Response)

messmar

messmar

Erfahrenes Mitglied
Hallo zusammen,

ich habe ein kleines Skript mit Ajax/jquery gebaut bzw. geändert/erweitert, um ein Request zu schicken und eine JSON response zu bekommen.

Wenn ich mir den Response, den der Server mir zurückgibt über den tcp-monitor anschaue, dann scheint es alles zu funkt. nur die AJAX Funktion gibt mir ein: "null" zurück, den ich mir über alert anzeigen lasse.

Ich glaube, dass ich in der Ajax Funktion und zwar bei der Abfrage für: "success" was falsch gemacht habe und kann es nicht finden ;-(

Kann bitte einer evtl. helfen?

Vielen Dank und Gruß
Meesmar

Ajax Code:

HTML: 
        <script type="text/javascript">
            $(document).ready(function() {
                //click event für submit button
                $("form").submit(function () {

                    //Daten von den HTML Feldern in JS-Vars übersetzen
                    var anrede = $('select[name=user_Title]');
                    var vorname = $('input[name=user_FirstName]');
                    var name = $('textarea[name=user_LastName]');
                    var c_email = $('input[name=user_Email]');

                    //die Daten sollen per GET an das Skript weitergeleitet werden. Dafür bauen wir einen String
                    var data = 'anrede=' + anrede.val() + '&vorname=' + vorname.val() + '&name=' + name.val()
                        + '&c_email=' + c_email.val();
                    //Request abschicken

                    $.ajax({
                        //Ort des Skriptes in dem die per GET übertragenen Daten verarbeitet werden sollen
                        url: "http://xxxxxx.yyyyy:8080",

                        //Angabe der GET Methode, auch POST wäre möglich. Allerdings nur sinnvoll bei größeren Datenmengen
                        type: "GET",

                        //Daten die gesendet werden sollen
                        data: data,
                        
                        contentType: "application/json; charset=utf-8",
                        dataType: "json",

                        //bei Antwort des Requests (Response)
                        success: function (reqCode) {
                            //wenn  true bzw. den Status 1 zurückliefert
                            alert(reqCode)
                        },
			error:function(x,e){
				if(x.status==0){
					alert('You are offline!!\n Please Check Your Network.');
				}else if(x.status==404){
					alert('Requested URL not found.');
				}else if(x.status==500){
					alert('Internel Server Error.');
				}else if(e=='parsererror'){
					alert('Error.\nParsing JSON Request failed.');
				}else if(e=='timeout'){
					alert('Request Time out.');
				}else {
					alert('Unknow Error.\n'+x.responseText);
				}
			}
                        
                    });

                    return false;
                    //der return wird benötigt, damit das Formular nicht tatsächlich abgeschickt wird und
                    //sich nicht wie ein normales Form mit Seiten Refresh verhält.
                });
            });
        </script>
 
Zuletzt bearbeitet:
Ok, fine....

das war zunächst ein Denkfehler von mir... die Abfrage die ich in: "success" hatte, macht überhaput keinen Sinn.

Folgendes musste eingebaut werden (error handling.):
HTML: 
error:function(x,e){
				if(x.status==0){
					alert('You are offline!!\n Please Check Your Network.');
				}else if(x.status==404){
					alert('Requested URL not found.');
				}else if(x.status==500){
					alert('Internel Server Error.');
				}else if(e=='parsererror'){
					alert('Error.\nParsing JSON Request failed.');
				}else if(e=='timeout'){
					alert('Request Time out.');
				}else {
					alert('Unknow Error.\n'+x.responseText);
				}
			}

Jetzt bräuchte ich das Bearbeiten der JSON Response in der: "success" methode...
Das musste ich dann bearbeiten/parsen könnnen.

HTML: 
{

    * message: "user created"
    * success: "true"
    * userid: "274736"

}


Einen Tipp vielleicht ;-)

Vielen Dank im Voraus.
 
Zuletzt bearbeitet:
Hi,

handelt es sich bei
Code: 
{

    * message: "user created"
    * success: "true"
    * userid: "274736"

}
um die Antwort des Requests?

Falls dies der Fall sein sollte, kann es nicht funktionieren, da es sich nicht um einen gültigen JSON-String handelt.

Korrekt könnte dieser wie folgt aussehen:
Code: 
'{"message": "user created", "success": "true", "userid": "274736"}'

Der Zugriff in der success-Methode auf die message-Eigenschaft erfolgt über die Punktnotation:
Code: 
alert(reqCode.message);

Ciao
Quaese
 
Hi Quaese,

Danke schon mal für die Hilfe.

handelt es sich bei
Code: 
{

    * message: "user created"
    * success: "true"
    * userid: "274736"

}
um die Antwort des Requests?
Zum Vergrößern anklicken....

Leider ja... das ist was dann im Browser als Response rauskommt.

....

Korrekt könnte dieser wie folgt aussehen:
Code: 
'{"message": "user created", "success": "true", "userid": "274736"}'
Zum Vergrößern anklicken....

Das hast du Recht... ich habe es irgendwo in einem Tutorial auch gelesen... dann muss man halt den JSON Response neu formatieren nicht?

Danke & Gruß
Messmar
 
Hi,

ich habe die JSON-Ausgabe des Servers gecheckt und die ist richtig, wie es sein muss. Das ist nur der Browser, der den Response so formatiert. Es kann glaube ich nicht das Problem sein.

Und das hier:
HTML: 
alert(reqCode.message);
bringt mich leider nicht sehr viel weit... "undefined".

und Folgendes, habe ich in der: "success" als CallBack Methode:
HTML: 
success: function(req) {
      alert('message : ' + req.message);
      alert('success : ' + req.success);
      alert('userid : ' + req.userid);
},

Da bekomme ich aber auch: "undefined" für :"req".

Wie kann ich dann auf das JSON File innerhalb der: "success" zugreifen? Status ist : success, aber Response ist immer ein: null.

Danke & Gruß
Messmar
 
Zuletzt bearbeitet:
Wenn in deinem Fall req nichts liefert, dann bedeutet dies schlicht, dass die Antwort kein gültiger JSON-String ist, auch wenn du es gecheckt hast.

Wo der Fehler liegt, lässt sich nicht sagen, ohne die tatsächliche Antwort des Servers zu kennen.
 
Hi,

wenn die JSON-Ausgabe des Servers in Ordnung ist, sollte es funktionieren, wie du es hast.

In meinem Testdokument funktioniert es tadellos:
Code: 
<?php
  if(isset($_REQUEST['anrede']) && ($_REQUEST['anrede']!="")){
    // Serverantwort simulieren (JSON-String generieren)
    $strJSON = '{"message": "user created", "success": "true", "userid": "274736"}';
    echo($strJSON);
    exit;
  }
?>

<!doctype html public "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>www.tutorials.de</title>
<meta name="author" content="Quaese">
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<script src="jquery-1.4.2.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
  //click event für submit button
  $(".myForm").submit(function () {
      //Daten von den HTML Feldern in JS-Vars übersetzen
      /*var anrede = $('select[name=user_Title]');
      var vorname = $('input[name=user_FirstName]');
      var name = $('textarea[name=user_LastName]');
      var c_email = $('input[name=user_Email]');

      //die Daten sollen per GET an das Skript weitergeleitet werden. Dafür bauen wir einen String
      var data = 'anrede=' + anrede.val() + '&vorname=' + vorname.val() + '&name=' + name.val()
          + '&c_email=' + c_email.val();*/

      // Beispiel-Daten
      var data = 'anrede=Herr';


      //Request abschicken
      $.ajax({
          //Ort des Skriptes in dem die per GET übertragenen Daten verarbeitet werden sollen
          url: "<?php echo($_SERVER['PHP_SELF']); ?>",

          //Angabe der GET Methode, auch POST wäre möglich. Allerdings nur sinnvoll bei größeren Datenmengen
          type: "GET",

          //Daten die gesendet werden sollen
          data: data,

          contentType: "application/json; charset=utf-8",
          dataType: "json",

          //bei Antwort des Requests (Response)
          success: function (req) {
              //wenn  true bzw. den Status 1 zurückliefert
              alert('message : ' + req.message);
              alert('success : ' + req.success);
              alert('userid : ' + req.userid);
          },
	        error:function(x,e){
	          if(x.status==0){
	            alert('You are offline!!\n Please Check Your Network.');
	          }else if(x.status==404){
	            alert('Requested URL not found.');
	          }else if(x.status==500){
	            alert('Internel Server Error.');
	          }else if(e=='parsererror'){
	            alert('Error.\nParsing JSON Request failed.');
	          }else if(e=='timeout'){
	            alert('Request Time out.');
	          }else {
	            alert('Unknow Error.\n'+x.responseText);
	          }
	        }
      });

      return false;
      //der return wird benötigt, damit das Formular nicht tatsächlich abgeschickt wird und
      //sich nicht wie ein normales Form mit Seiten Refresh verhält.
  });
});
</script>
</head>
<body >
<form class="myForm"><input type="submit"></input></form>
</body>
</html>

Ciao
Quaese
 
Danke schon mal.

die Antwort des Servers sieht auf die Konsole/shell so aus z.B.:
HTML: 
{"message":"user created","success":"true","userid":"273751"}
{"message":"user already exists","success":"false","userid":"-1"}

Aber wenn ich den Request im Browser händisch eingebe und zwar mit dem ganzen QueryString: "?user_Email=xxx&etc." dann kommt es im firefox so formatiert z.B.:
HTML: 
{

    * message: "user created"
    * success: "true"
    * userid: "275889"

}

Danke
Messmar
 
messmar hat gesagt.:
die Antwort des Servers sieht auf die Konsole/shell so aus z.B.:
HTML: 
{"message":"user created","success":"true","userid":"273751"}
{"message":"user already exists","success":"false","userid":"-1"}
Zum Vergrößern anklicken....

Das ist die Antwort auf einen einzigen Request?
Dann ist es kein JSON....

dieses ist JSON
Code: 
{"message":"user created","success":"true","userid":"273751"}

jenes auch:
Code: 
{"message":"user already exists","success":"false","userid":"-1"}

..beides zusammen aber nicht.
 
Sorry, natürlich nicht beide zusammen...

habe es nur so gepostet und bin davon ausgegangen, dass es klar sei, das sie natürlich
einzelne gemeint sind.
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück