livescore php en ajax/jquery
Hallo,
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:
feed.php:
Hopelijk weten jullie wat ik fout doe.
Bedankt!
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!
kan je mogelijk via JSfiddle.net een testcase maken? Dan zal er meer over duidelijk worden.
Of kan je aangeven waar in de code de 'undefined' getriggerd wordt?
Of kan je aangeven waar in de code de 'undefined' getriggerd wordt?
Ik heb een andere code die de "undefined" terug geeft. Dat is onderstaande:
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
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/
Ik neem aan dat je wel de jQuery-library inlaadt?
Ja, in de head-tags
Print_r() geeft geen geldige JSON-format voor data terug.
print_r() was er alleen voor om te zorgen dat ik kreeg te zien wat de de inhoud was van json_encode(). Output is als volgt:
En wat zegt de error-console (Ctrl+SHIFT+J) ?
Console geeft enkel een error die betrekking heeft op de Facebook login knop op mijn pagina. De javascript code van Facebook staat onder de code voor de live score.
Je JSON is verkeerd, je echoed elke keer 1 JSON array. Alleen deze JSON array moet ook weer in JSON geplaatst worden anders krijgt de Ajax call geen juiste JSON aangeleverd waardoor er "undefined".
Sabaton, jou code werkt helaas niet helemaal. wanneer ik de regel
aanpas naar:
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
aanpas naar:
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
Moet wel $return[] zijn anders krijg je inderdaad alleen het laatste item.. Wat werk er niet precies dan?
return geeft 10 record terug zoals ook zou moeten volgens de database query. De javascript geeft dan echter "undefined" terug
--
Probleem is opgelost!
Ik heb de javascript code aangepast naar onderstaand. nu wordt alles juist weergegeven. In ieder geval bedankt voor jullie hulp!
--
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




