Iets uit database halen met AJAX
Maar deze query in het script zou je om kunnen zetten naar een
SELECT veld1, veld2, veld3 FROM chat enz........
Want ik vermoed dat de toevoegen van iets in je script deze opmaak heeft.
INSERT TO chat ( veld1, veld2, veld3 ) VALUE (veld1, veld2, veld3) enz.....
Gewijzigd op 18/05/2012 14:13:11 door Frank WD
Aan de browser kant handel je het af met javascript.
Goed bezien is er dus geen antwoord op je vraag te geven en het lijkt me goed als je duidelijker uitlegt waar je probleem zit. Is het het afhandelen in de browser met javascript, of heb je een probleem met php?
Bij het bezoeken van de PHP pagina wordt er gevraagd om een naam te verzinnen en die ingevulde naam wordt in een sessie gezet en er wordt een rij in de database toegevoegd. Daarna is het een heel gewone chat. Je hebt je ingevulde naam dus nodig om de chat te gebruiken. Om dataverkeer te besparen wil ik graag met AJAX iets om het X aantal soconden uit de database halen waar dus de gesprekken in staan. En ik weet dus niet hoe dat moet. Eerst deed ik een Iframe steeds herladen met javascript. Is dat mischien ook goed?
Het kan uiteraard ook zonder jQuery, maar jQuery maakt het wel simpel.
database gegevens aanpassen uiteraard, zien dat er data is, ...
Wat je ziet: je kan zelf surfen naar
index.php?ajax=1
Dan zie je de posts, zonder verder iets.
Wat ajax dus doet: je laat javascript surfen naar die webpagina. Wat normaal op het scherm zou komen, wordt in een variabele gestoken en meegegeven aan een callback (functie). Die callback wordt getriggerd op het moment dat de data is opgehaald.
Daar kan je dus doen wat je wil met die data.
bv. steken in een div
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
<?php
// http://www.phphulp.nl/php/forum/topic/iets-uit-database-halen-met-ajax/84680/1/#603723
// hier gaan we de data ophel en terug geven aan de Ajax request
if (isset($_GET['ajax'])) {
// Hier moet je uiteraard zelf zien dat je de juiste connectie maakt, de juiste data ophaalt ...
$content = "";
$con = mysql_connect('localhost', 'root', '');
mysql_select_db('phphulp', $con);
// read all records
$readSQL = "SELECT id, message, created FROM euro ORDER BY created DESC";
$res = mysql_query($readSQL);
while($row = mysql_fetch_assoc($res)) {
$content .= '
<li>
<div class="message">' . htmlentities($row['message'], ENT_QUOTES, "UTF-8") . '</div>
<div class="created">' . htmlentities($row['created'], ENT_QUOTES, "UTF-8") . '</div>
</li>';
}
$content = '<ul>' . $content . '</ul>';
// nu gaan we deze content echo'en. Deze echo komt dus niet op het scherm, maar wordt aan javascript gegeven
echo $content;
// Echo enkel deze content; niet ook de <!DOCTYPE html> <html> ...
// nu gaan we de pagina verlaten, zodat de rest van de code niet wordt uitgevoerd
exit;
}
?>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Demo - Ajax - data ophalen</title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(e){ // dit wordt uitgevoerd als de pagina geladen is en de dom gebruiksklaar is
// we binden een trigger aan een element. Op het moment dat op de knop wordt gedrukt, doen we het volgnde:
$('#get_data').click(function(e){
// we voeren het ajax request uit. Het ophalen van de data wordt asynchroon gedaan. Op het moment dat het request klaar is, wordt een functie uitgevoerd, zie hier onder
$.ajax({
url: 'index.php?ajax=1',
success: function(data) { // deze functie wordt uitgevoerd nadat de data volledig is geladen. je hebt var data ter beschikking. Dit is wat gecho'd is ...
// data steken in een div, met id="results"
$('#results').html(data);
}
});
});
});
</script>
</head>
<body>
<input type="button" id="get_data" value="GET data"/>
<div id="results"></div>
</body>
</html>
// http://www.phphulp.nl/php/forum/topic/iets-uit-database-halen-met-ajax/84680/1/#603723
// hier gaan we de data ophel en terug geven aan de Ajax request
if (isset($_GET['ajax'])) {
// Hier moet je uiteraard zelf zien dat je de juiste connectie maakt, de juiste data ophaalt ...
$content = "";
$con = mysql_connect('localhost', 'root', '');
mysql_select_db('phphulp', $con);
// read all records
$readSQL = "SELECT id, message, created FROM euro ORDER BY created DESC";
$res = mysql_query($readSQL);
while($row = mysql_fetch_assoc($res)) {
$content .= '
<li>
<div class="message">' . htmlentities($row['message'], ENT_QUOTES, "UTF-8") . '</div>
<div class="created">' . htmlentities($row['created'], ENT_QUOTES, "UTF-8") . '</div>
</li>';
}
$content = '<ul>' . $content . '</ul>';
// nu gaan we deze content echo'en. Deze echo komt dus niet op het scherm, maar wordt aan javascript gegeven
echo $content;
// Echo enkel deze content; niet ook de <!DOCTYPE html> <html> ...
// nu gaan we de pagina verlaten, zodat de rest van de code niet wordt uitgevoerd
exit;
}
?>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Demo - Ajax - data ophalen</title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(e){ // dit wordt uitgevoerd als de pagina geladen is en de dom gebruiksklaar is
// we binden een trigger aan een element. Op het moment dat op de knop wordt gedrukt, doen we het volgnde:
$('#get_data').click(function(e){
// we voeren het ajax request uit. Het ophalen van de data wordt asynchroon gedaan. Op het moment dat het request klaar is, wordt een functie uitgevoerd, zie hier onder
$.ajax({
url: 'index.php?ajax=1',
success: function(data) { // deze functie wordt uitgevoerd nadat de data volledig is geladen. je hebt var data ter beschikking. Dit is wat gecho'd is ...
// data steken in een div, met id="results"
$('#results').html(data);
}
});
});
});
</script>
</head>
<body>
<input type="button" id="get_data" value="GET data"/>
<div id="results"></div>
</body>
</html>
Gewijzigd op 19/05/2012 22:30:27 door Kris Peeters