jQuery $.ajax request of dataType json ruft keine Daten vom PHP-Skript ab

Question

Ich habe überall nach einer Lösung gesucht, aber ich kann nichts finden, was funktioniert. Ich versuche, eine Reihe von Daten aus der Datenbank zu erhalten und dann über AJAX autocomplete Eingabefelder in einem Formular. Um dies zu tun, habe ich beschlossen, json zu verwenden, denn warum nicht, richtig? Alternativ habe ich darüber nachgedacht, einfach eine abgegrenzte Zeichenkette zurückzusenden und diese dann zu tokenisieren, was im Nachhinein betrachtet viel einfacher gewesen wäre und mir Kopfschmerzen erspart hätte... Da ich mich für json entschieden habe, sollte ich wohl dabei bleiben und herausfinden, was falsch gelaufen ist! Wenn die Funktion get_member_function() ausgeführt wird, erscheint eine Fehlermeldung in einem Alert-Dialog und lautet "[object Object]". Ich habe dies auch mit der GET-Anforderung und der Einstellung des ContentType auf "application/json; charset=utf-8" versucht. Leider ohne Erfolg. Kann mir bitte jemand sagen, was ich falsch mache? Mach's gut, Piotr.

Meine javascript/jQuery Funktion ist wie folgt:

function get_member_info()
   {

   var url = "contents/php_scripts/admin_scripts.php"; 
   var id = $( "select[ name = member ] option:selected" ).val();

   $.ajax(
   {

      type: "POST",
      dataType: "json",
      url: url,
      data: { get_member: id },
      success: function( response ) 
      { 

          $( "input[ name = type ]:eq( " + response.type + " )" ).attr( "checked", "checked" );
          $( "input[ name = name ]" ).val( response.name );
          $( "input[ name = fname ]" ).val( response.fname );
          $( "input[ name = lname ]" ).val( response.lname );
          $( "input[ name = email ]" ).val( response.email );
          $( "input[ name = phone ]" ).val( response.phone );
          $( "input[ name = website ]" ).val( response.website );
          $( "#admin_member_img" ).attr( "src", "images/member_images/" + response.image );

      },
      error: function( error )
      {

         alert( error );

      }

   } );

}

und der entsprechende Code in "contents/php_scripts/admin_scripts.php" lautet wie folgt:

   if( isset( $_POST[ "get_member" ] ) )
   {

      $member_id = $_POST[ "get_member" ];
      $query = "select * from members where id = '$member_id'";

      $result = mysql_query( $query );

      $row = mysql_fetch_array( $result );

      $type = $row[ "type" ];
      $name = $row[ "name" ];
      $fname = $row[ "fname" ];
      $lname = $row[ "lname" ];
      $email = $row[ "email" ];
      $phone = $row[ "phone" ];
      $website = $row[ "website" ];
      $image = $row[ "image" ];

      $json_arr = array( "type" => $type, "name" => $name, "fname" => $fname, "lname" => $lname, "email" => $email, "phone" => $phone, "website" => $website, "image" => $image );

      echo json_encode( $json_arr );

   }

Answer 1

Ich glaube, das kenne ich...

Versuchen Sie, Ihr JSON als JSON zu senden, indem Sie die PHP-Funktion header() Funktion:

/**
 * Send as JSON
 */
header("Content-Type: application/json", true);

Obwohl Sie gültiges JSON übergeben, glaubt jQuerys $.ajax das nicht, weil ihm der Header fehlt.

jQuery funktionierte früher auch ohne die Kopfzeile, wurde aber vor ein paar Versionen geändert.

ALSO

Stellen Sie sicher, dass Ihr Skript gültiges JSON zurückgibt. Verwenden Sie Firebug o Google Chrome's Entwickler-Tools um die Antwort auf die Anfrage in der Konsole zu überprüfen.

UPDATE

Sie sollten auch Ihren Code aktualisieren, um $_POST zu bereinigen, um SQL-Injection-Angriffe zu vermeiden. Außerdem sollten Sie einige Fehler abfangen.

if (isset($_POST['get_member'])) {

    $member_id = mysql_real_escape_string ($_POST["get_member"]);

    $query = "SELECT * FROM `members` WHERE `id` = '" . $member_id . "';";

    if ($result = mysql_query( $query )) {

       $row = mysql_fetch_array($result);

       $type = $row['type'];
       $name = $row['name'];
       $fname = $row['fname'];
       $lname = $row['lname'];
       $email = $row['email'];
       $phone = $row['phone'];
       $website = $row['website'];
       $image = $row['image'];

       /* JSON Row */
       $json = array( "type" => $type, "name" => $name, "fname" => $fname, "lname" => $lname, "email" => $email, "phone" => $phone, "website" => $website, "image" => $image );

    } else {

        /* Your Query Failed, use mysql_error to report why */
        $json = array('error' => 'MySQL Query Error');

    }

     /* Send as JSON */
     header("Content-Type: application/json", true);

    /* Return JSON */
    echo json_encode($json);

    /* Stop Execution */
    exit;

}

Answer 2

Versuchen Sie, jQuery.parseJSON zu verwenden, wenn Sie die Daten zurückerhalten.

type: "POST",
dataType: "json",
url: url,
data: { get_member: id },
success: function(data) { 
    response = jQuery.parseJSON(data);
    $("input[ name = type ]:eq(" + response.type + " )")
        .attr("checked", "checked");
    $("input[ name = name ]").val( response.name);
    $("input[ name = fname ]").val( response.fname);
    $("input[ name = lname ]").val( response.lname);
    $("input[ name = email ]").val( response.email);
    $("input[ name = phone ]").val( response.phone);
    $("input[ name = website ]").val( response.website);
    $("#admin_member_img")
        .attr("src", "images/member_images/" + response.image);
},
error: function(error) {
    alert(error);
}

Answer 3

En $.ajax error Funktion benötigt drei Argumente, nicht nur eines:

error: function(xhr, status, thrown)

Um die Ursache zu finden, müssen Sie den 2. und 3. Parameter wegwerfen, nicht den ersten.

Answer 4

Versuchen Sie zusätzlich zu McHerbies Hinweis json_encode( $json_arr, JSON_FORCE_OBJECT ); wenn Sie mit PHP 5.3 arbeiten...

Answer 5

Try this...  
  <script type="text/javascript">

    $(document).ready(function(){

    $("#find").click(function(){
        var username  = $("#username").val();
            $.ajax({
            type: 'POST',
            dataType: 'json',
            url: 'includes/find.php',
            data: 'username='+username,
            success: function( data ) {
            //in data you result will be available...
            response = jQuery.parseJSON(data);
//further code..
            },

    error: function(xhr, status, error) {
        alert(status);
        },
    dataType: 'text'

    });
        });

    });

    </script>

    <form name="Find User" id="userform" class="invoform" method="post" />

    <div id ="userdiv">
      <p>Name (Lastname, firstname):</p>
      </label>
      <input type="text" name="username" id="username" class="inputfield" />
      <input type="button" name="find" id="find" class="passwordsubmit" value="find" />
    </div>
    </form>
    <div id="userinfo"><b>info will be listed here.</b></div>