Wie bekomme ich die Ergebnisse einer MySQL-Abfrage in HTML-Textfeld

Arbeite daran seit 8 Stunden und habe nicht überall hin. Änderungen nur vorgenommen, um in einen anderen Block zu gelangen. Begann über und zurück zu fast Square-1. Ich suche Hilfe, um zu verstehen, was ich falsch mache. Ich habe es geschafft, indem ich alle Schüler in einen Tisch zurückgebracht habe, aber das ist nicht das, was ich brauche. Was ich versuche zu tun ist: 1. Benutzer auffordern, einen Studentenausweis einzugeben. 2. Führen Sie die ID gegen eine MySQL-Abfrage 3. Geben Sie die Informationen über den Schüler (ID, Name, E-Mail und GPA) in 4 Textfelder. Ich weiß, dass ich ein Array brauche und dann in der js/ajax die Antwort zwischen den 4 Textfeldern aufgeteilt. Wie rufe ich das Array in der Funktion und dann das Ergebnis für diesen Schüler in die Textfelder ausgeben? Jede Hilfe oder Beratung wird geschätzt. DieseWie bekomme ich die Ergebnisse einer MySQL-Abfrage in HTML-Textfeld

ist, was ich habe, so weit: html:

<script type="text/javascript"> 
function queryStudent() { 
    var ajaxRequest; 
    try { 
     ajaxRequest = new XMLHttpRequest; 
    }catch(e) { 
     //IE Browsers 
     try { 
      ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP"); 
      } catch (e) { 
       try{ 
        ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP"); 
       } catch (e){ 
        // Something went wrong 
        alert("Browser not compatible"); 
        return false; 
       } 
      } 
    } 
    ajaxRequest.onreadystatechange = function() { 
     if(ajaxRequest.readyState == 4 && ajaxRequest.status == 200) { 
      //delcare a array 
      //use ajax response.split to return the results of query to each textbox here 
      var results = ajaxRequest.responseText.split(); //how do i get query results in here 
      //output array indexes to html element id's 
      document.getElementById('studentID').value = response[0]; //fill text box 1 
      document.getElementById('stuName').value = response[1];//text box 2 
      document.getElementById('email').value = response[2]; 
      document.getElementById('GPA').value = response[3];   
} 
}; 
     var stuID = document.getElementByID('stuID').value 
     var queryString = "?stuID=" + stuID; 
     ajaxRequest.open("POST", "search_single.php"+ queryString, true); 
     ajaxRequest.send(stuID); 

     } 
</script> 
<form name="student" method="post" action="search_single.php"> 
<label>StudentID:</label> 
<input type="text" id="input" name="stuID" value=""> 
<br> 
<br> 
<input type="button" onclick="queryStudent();" value="Search" id="button"> 
</form> 
<h2>Student information will be displayed in the textboxes below:</h2> 
<br> 
<table id="outuput"> 
<tr> 
    <td><label>Student ID:</label></td> 
    <td><input type="text" id="stuID" value="" readonly></td> 
</tr> 
<tr> 
    <td><label>Student Name:</label></td> 
    <td><input type="text" id="stuName" value="" readonly></td> 
</tr>  
<tr> 
    <td><label>Email:</label></td> 
    <td><input type="text" id="email" value=" " readonly></td> 
</tr> 
<tr> 
    <td><label>GPA:</label></td> 
    <td><input type="text" id="gpa" value=" " readonly></td> 
</tr> 
<br> 
</table></body>

PHP:

$stuID = filter_input(INPUT_POST, 'studentID'); 
//Code for query 
$query = 'SELECT * 
      FROM student 
      WHERE studentID = :stuID'; 
$statement = $db->prepare($query); // 
$statement->bindValue(':stuID', $stuID); //bind all values (name, email..ect)? 
$statement->execute(); 
$students = $statement->fetch(); //Fetch individual row's

Quelle

2016-05-01 allendks45

ersetzen .innerHTML() mit .value und Mehrwert = "" zu jedem Input-Tag. –

Es scheint auch, als ob Sie versuchen, die stuID aus dem falschen Eingabefeld abzurufen. –

hat einige Änderungen am Code vorgenommen, jedoch sind Textfelder nach dem Ausführen immer noch leer. – allendks45

Ich habe bei Ihnen Code, um einen genaueren Blick hatte, und fand eine ganze Reihe von Fehlern. Ich empfehle Ihnen, eine IDE für die Entwicklung zu verwenden. IDEs verfügen über eine automatisierte Codevalidierung, mit der Fehler einfach erkannt und korrigiert werden können. Machen Sie es sich auch zur Gewohnheit, die PHP docs auf Funktionen zu lesen. Ähnliche Dokumente für Javascript ist here.

Client-Code

<!DOCTYPE html> 
<html> 
<head> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <script type="text/javascript"> 
    function queryStudent() { 
     //Retrieve user input, student ID 
     var stuID = document.getElementById('input').value 

     //Build querystring 
     var queryString = "?stuID=" + stuID; 

     //Create XMLHttpRequest 
     var xmlhttp = new XMLHttpRequest(); 

     //Define function to process server feedback 
     xmlhttp.onreadystatechange = function() { 
      if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { 

       //Parse reponse 
       var obj = JSON.parse(xmlhttp.responseText); 

       //Populate form 
       document.getElementById('stuID').value = obj[0].studentID; 
       document.getElementById('stuName').value = obj[0].stuName; 
       document.getElementById('email').value = obj[0].email; 
       document.getElementById('gpa').value = obj[0].GPA; 
      } 
     }; 
     //Run query 
     xmlhttp.open("POST", "search_single.php" + queryString, true); 
     xmlhttp.send(); 
    } 
    </script> 
</head> 
<body> 

    <form name="student" method="post" action="search_single.php"> 
     <label>StudentID:</label> 
     <input type="text" id="input" name="stuID" value=""> 
     <br> 
     <br> 
     <input type="button" onclick="queryStudent();" value="Search" id="button"> 
    </form> 
    <h2>Student information will be displayed in the textboxes below:</h2> 

    <table id="output"> 
     <tr> 
      <td><label>Student ID:</label></td> 
      <td><input type="text" id="stuID" value="" readonly></td> 
     </tr> 
     <tr> 
      <td><label>Student Name:</label></td> 
      <td><input type="text" id="stuName" value="" readonly></td> 
     </tr>  
     <tr> 
      <td><label>Email:</label></td> 
      <td><input type="text" id="email" value=" " readonly></td> 
     </tr> 
     <tr> 
      <td><label>GPA:</label></td> 
      <td><input type="text" id="gpa" value=" " readonly></td> 
     </tr> 
    </table> 


</body> 
</html>

Server Code

<?php 

//------------------------- 
//Database constants, enter your DB info into these constants : 
define(DB_HOST,  "hostname"); 
define(DBUSER,  "username"); 
define(DBPASS,  "password"); 
define(DBSCHEME, "databasename"); 
//------------------------- 

//Create DB link 
$con = new PDO('mysql:host='.DB_HOST.';dbname='.DBSCHEME, DBUSER, DBPASS); 
$con->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION); 

//Retrieve user input 
$stuID = $_REQUEST['stuID']; 

//Evaluate user input 
if($stuID == "") 
    die("Invalid Student ID"); 

//Prepare and execute 
$sql = 'SELECT studentID, stuName, email, GPA FROM student WHERE studentID = :stuID'; 
$query = $con->prepare($sql); 
$query->bindValue(':stuID', $stuID, PDO::PARAM_STR); 
$query->execute(); 

//Retrieve results 
$students = $query->fetchAll(PDO::FETCH_ASSOC); 
$json = json_encode($students); 

//Output to ajax 
echo $json;

Quelle

2016-05-02 08:10:56

Das ist hervorragend! Viel sauberere Erklärung als das Buch, das ich derzeit selbst lehre. Ich werde das mit meinem db ausprobieren und von dort aus gehen. Irgendeine Idee, warum das Buch mich dazu brachte, ein Array zu verwenden und es dann mit einer 'responseRequest.split()' zu teilen? Alles, was ich auf SO und dr gesucht habe. Google hat mich zu JSON geführt, was mir auch neu ist. Sehr geschätzter Lernpunkt. – allendks45

Glücklich zu helfen :) Wenn es um Split String vs Json kommt, denke ich, der Grund ist streng pädagogisch. –

Wie bekomme ich die Ergebnisse einer MySQL-Abfrage in HTML-Textfeld

Antwort

Verwandte Themen