livescore php en ajax/jquery
Ik wil graag een live score maken voor mijn website, maar ik krijg het niet voor elkaar. Wanneer ik verschillende tutorials volg krijg ik meestal niets te zien op mijn website of er komt "undefined" te staan.
Hebben jullie een goede tutorial of weten jullie wat er mis is met mijn code?
De gegevens worden wel juist opgehaald via feed.php
Onderstaand de code:
index.html:
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
2
3
4
5
6
7
8
9
10
11
12
13
14
<script>
$(document).ready(function(){
var url = 'feed.php';
$.getJSON(url, function(data) {
$.each(data, function(index, data) {
$('#score').append('<tr>');
$('#score').append('<td>'+data.voornaam+'</td>');
$('#score').append('<td>'+data.achternaam+'</td>');
$('#score').append('<td><b>'+data.score+'</b></td>');
$('#score').append('</tr>');
});
});
});
</script>
$(document).ready(function(){
var url = 'feed.php';
$.getJSON(url, function(data) {
$.each(data, function(index, data) {
$('#score').append('<tr>');
$('#score').append('<td>'+data.voornaam+'</td>');
$('#score').append('<td>'+data.achternaam+'</td>');
$('#score').append('<td><b>'+data.score+'</b></td>');
$('#score').append('</tr>');
});
});
});
</script>
feed.php:
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
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
<?php
$con = "VERBINDING MET DATABASE OPZETTEN";
$sql = "SELECT
game.userID,
game.score,
roboshooter.id,
roboshooter.voornaam,
roboshooter.achternaam
FROM
game, roboshooter
WHERE
game.userID = roboshooter.id
ORDER BY game.score DESC LIMIT 10
";
$result = mysqli_query($con,$sql);
while($row = mysqli_fetch_array($result))
{
$return = array(
'voornaam' => $row['voornaam'],
'achternaam' => $row['achternaam'],
'score' => $row['score']
);
// 'voornaam' = $row['voornaam'];
echo json_encode($return);
}
?>
$con = "VERBINDING MET DATABASE OPZETTEN";
$sql = "SELECT
game.userID,
game.score,
roboshooter.id,
roboshooter.voornaam,
roboshooter.achternaam
FROM
game, roboshooter
WHERE
game.userID = roboshooter.id
ORDER BY game.score DESC LIMIT 10
";
$result = mysqli_query($con,$sql);
while($row = mysqli_fetch_array($result))
{
$return = array(
'voornaam' => $row['voornaam'],
'achternaam' => $row['achternaam'],
'score' => $row['score']
);
// 'voornaam' = $row['voornaam'];
echo json_encode($return);
}
?>
Hopelijk weten jullie wat ik fout doe.
Bedankt!
Of kan je aangeven waar in de code de 'undefined' getriggerd wordt?
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
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
<script>
$.get("feed.php", function(data) {
$("#score")
.append("<tr><td>" + data.voornaam + "</td><td>" + data.achternaam + "</td><td>" + data.score +"</td></tr>").fadeIn("slow");
}, "json")
</script>
<?php
$sql = "SELECT
game.userID,
game.score,
roboshooter.id,
roboshooter.voornaam,
roboshooter.achternaam
FROM
game, roboshooter
WHERE
game.userID = roboshooter.id
ORDER BY game.score DESC LIMIT 10
";
$result = mysqli_query($con,$sql);
while($row = mysqli_fetch_assoc($result))
{
$return = json_encode(array(
"voornaam" => $row['voornaam'],
"achternaam" => $row['achternaam'],
"score" => $row['score']
));
print_r($return);
}
?>
$.get("feed.php", function(data) {
$("#score")
.append("<tr><td>" + data.voornaam + "</td><td>" + data.achternaam + "</td><td>" + data.score +"</td></tr>").fadeIn("slow");
}, "json")
</script>
<?php
$sql = "SELECT
game.userID,
game.score,
roboshooter.id,
roboshooter.voornaam,
roboshooter.achternaam
FROM
game, roboshooter
WHERE
game.userID = roboshooter.id
ORDER BY game.score DESC LIMIT 10
";
$result = mysqli_query($con,$sql);
while($row = mysqli_fetch_assoc($result))
{
$return = json_encode(array(
"voornaam" => $row['voornaam'],
"achternaam" => $row['achternaam'],
"score" => $row['score']
));
print_r($return);
}
?>
Fiddle van script zonder weergaven: http://jsfiddle.net/juleskreutzer/thkfhj2o/
Fiddle van script met de weergaven "undefined": http://jsfiddle.net/juleskreutzer/jh2kyopk/
Code (php)
1
{"voornaam":"Thijs","achternaam":"De Vries","score":"24"}{"voornaam":"Thijs","achternaam":"De Vries","score":"23"}{"voornaam":"Sem","achternaam":"van Halbeek","score":"20"}{"voornaam":"Jules","achternaam":"Kreutzer","score":"13"}{"voornaam":"Sem","achternaam":"van Halbeek","score":"4"}
Code (php)
1
$return[] = array( ... );
aanpas naar:
Code (php)
1
$return = array( ...);
dan werkt het wel, echter krijg ik dan alleen de laatste record te zien.
Zou ik dit kunnen oplossen met een for-loop in de javascript code? indien ja, dan gebruik ik waarschijnlijk een verkeerde code
Code (php)
1
2
3
2
3
for(var i = 0; i < 10; i++) {
...
}
...
}
--
Probleem is opgelost!
Ik heb de javascript code aangepast naar onderstaand. nu wordt alles juist weergegeven. In ieder geval bedankt voor jullie hulp!
Code (php)
1
2
3
4
5
6
7
8
2
3
4
5
6
7
8
<script>
$.get("feed.php", function(data) {
for(var i = 0; i < data.length; i++) {
$("#score")
.append("<tr><td>" + data[i].voornaam + "</td><td>" + data[i].achternaam + "</td><td><b>" + data[i].score +" punten</b></td></tr>");
}}, "json")
</script>
$.get("feed.php", function(data) {
for(var i = 0; i < data.length; i++) {
$("#score")
.append("<tr><td>" + data[i].voornaam + "</td><td>" + data[i].achternaam + "</td><td><b>" + data[i].score +" punten</b></td></tr>");
}}, "json")
</script>
Gewijzigd op 02/11/2014 20:25:54 door Jules Kreutzer