Wie lese ich eine MySQL-DB dynamisch aus (und verändere sie)?

[unimail]

Hallo Leute,

ich kenne mich zwar relativ gut mit PHP und MySQL aus, dafür aber leider umso weniger mit AJAY (JS). Dabei ist mein Anliegen gar nicht so kompliziert:

Ich habe eine MySQL-Datenbank, die so aussieht, mit - sagen wir - folgendem Beispielinhalt:

id;text
1;blabla
2;blubblub

Nun habe ich eine Seite, die diese Datenbankwerte ausliest und darstellt

• blabla
• blubblub

Gleichzeitig soll auf dieser Seite ein Formularfeld sein, das es ermöglicht, neue Werte in die MySQL-Db einzutragen. Das Problem ist nun, dass das Eintragen neuer Werte + das Darstellen derselbigen ohne nachladen des gesamten Fensterinhalts passieren soll. Außerdem soll das ganze über ein PHP-Skript laufen, da ich die Daten erst auswerten muss.

Ich hab schon eine zeit lang bei Google und hier gesucht, aber es geht schon damit los, dass ich gar nicht weiß, wonach ich suchen soll. Unter dem Stichwort "dynamische Listen" hab ich zumindest nichts gefunden. Mehr fällt mir nicht ein..

Nun.. Wie mach ich das?

 

[ComFreek]

Du brauchst dafür JavaScript- und AJAX-Kenntnisse.
Dafür gibt es sehr viele Tutorials im Internet (z.B. Google: JavaScript AJAX Tutorial).

Außerdem musst du ja natürlich die Daten aus der DB mit PHP auslesen.

 

[unimail]

Also die Daten auslesen und schreiben mit PHP/MySQL ist wirklich kein Problem, auch die FORM und die Übergabe an JS würde ich noch hinkriegen, aber wie gesagt, ein konkretes Tutorial dazu habe ich nicht gefunden...

 

[unimail]

So, ich hab nun etwas sehr vielversprechendes gefunden, und zwar ein Skript, das aus drei Dateien besteht.

ajax.php
Hier werden die DB-Werte ausgelesen, die AJAX-Response ausgegeben und neue Werte eingetragen

<!-- Include AJAX Framework -->
<script src="ajax_framework.js" language="javascript"></script>

<!-- Ausgabe der vorhandenen Wert -->
<?
require_once('inc/opendb.php');
$qu = mysql_query("SELECT * FROM validation");
while($data = mysql_fetch_array($qu)){
	echo $data['question']." - ".$data['answer']."<br>";
}
?>
<br>
<!-- Show Message for AJAX response -->
<div id="insert_response"></div>

<!-- Form: the action="javascript:insert()"calls the javascript function "insert" into ajax_framework.js -->
<form action="javascript:insert()" method="post">
<input name="qu" type="text" id="qu" value=""/>
<input name="an" type="text" id="an" value=""/>
<input type="submit" name="Submit" value="Insert"/>
</form>

ajax_framework.js
Sie verarbeitet die Werte und gibt sie anschließend an die insert.php weiter, die sie in die DB einträgt

/* ---------------------------- */
/* XMLHTTPRequest Enable */
/* ---------------------------- */
function createObject() {
var request_type;
var browser = navigator.appName;
if(browser == "Microsoft Internet Explorer"){
request_type = new ActiveXObject("Microsoft.XMLHTTP");
}else{
request_type = new XMLHttpRequest();
}
return request_type;
}

var http = createObject();


/* -------------------------- */
/* INSERT */
/* -------------------------- */
/* Required: var nocache is a random number to add to request. This value solve an Internet Explorer cache issue */
var nocache = 0;
function insert() {
// Optional: Show a waiting message in the layer with ID login_response
document.getElementById('insert_response').innerHTML = "Just a second..."
// Required: verify that all fileds is not empty. Use encodeURI() to solve some issues about character encoding.
var qu= encodeURI(document.getElementById('qu').value);
var an = encodeURI(document.getElementById('an').value);
// Set te random number to add to URL request
nocache = Math.random();
// Pass the login variables like URL variable
http.open('get', 'insert.php?qu='+qu+'&an='+an+'&nocache = '+nocache);
http.onreadystatechange = insertReply;
http.send(null);
}
function insertReply() {
if(http.readyState == 4){
var response = http.responseText;
// else if login is ok show a message: "Site added+ site URL".
document.getElementById('insert_response').innerHTML = response;
}
}

insert.php

<!-- Include Database connections info. -->
<?php require_once('inc/opendb.php'); ?>

<!-- Verify if user exists for login -->
<?php
if(isset($_GET['qu']) && isset($_GET['an'])){

$q= $_GET['qu'];
$a= $_GET['an'];
 
$insertSite_sql = "INSERT INTO validation (question, answer) VALUES ('$q','$a')";
$insertSite= mysql_query($insertSite_sql) or die(mysql_error());

echo "<b>Eingetragene Werte:</b> ".$q." - ".$a. "<br><br>";
} else {
echo 'Error! Please fill all fileds!';
}
?>

Das Problem
Ich bekomme zwar eine schöne Antwort vom Ajax-Skript, dass alles eingetragen wurde, doch um die Daten, die in die DB eingetragen wurden, wirklich darzustellen, muss ich die gesamte Seite neu laden. Wie muss ich das Skript ändern, damit es dynamisch neu lädt, sobald ein Eintrag getätigt wurde?

 

[jannicars]

guck dir lieber das hier an:
http://net.tutsplus.com/tutorials/php/asynchronous-comments-with-jquery-and-json/

Das nutzt die tolle Technologie "JSON" und das kann man auch leicht erweitern, dass es z.B.
jede Minute die Einträge dynamisch im Hintergrund nachlädt(also ohne Reload).

 

[unimail]

Genau DAS ist es, was ich gesucht habe, DANKE!