Variabele meesturen met Jquery
Code (php)
1
2
3
4
5
6
7
8
9
2
3
4
5
6
7
8
9
<script>
$(document).ready(function(){
setInterval(function(){
$("#list").load('shared/loadscript.php?draaiboekID=<? echo $draaiboekID; ?>')
}, 2000);
});
</script>
<div id="list"></div>
$(document).ready(function(){
setInterval(function(){
$("#list").load('shared/loadscript.php?draaiboekID=<? echo $draaiboekID; ?>')
}, 2000);
});
</script>
<div id="list"></div>
Deze jQuery werkt al en laadt de pagina loadscript.php.
Echter wordt de variabel niet meegestuurd. Hoe los ik dat op? Want hij moet bepaalde info laden op die pagina met het juiste $draaiboekID.
Gewijzigd op 13/01/2016 23:11:59 door - Ariën -
Verder raad ik aan om <?php te gebruiken.
Edit:
Topictitel verduidelijkt
Gewijzigd op 13/01/2016 23:12:54 door - Ariën -
Is het overigens nadelig om een lage interval in te stellen?
Want nu verschijnt de div pas na 2 seconden na het laden van de pagina.
Zie je vorige topic. Echter gebruik je dan GET i.p.v. POST. En als deze 'succes' is roept hij zich vanzelf opnieuw aan.
Gewijzigd op 13/01/2016 23:23:32 door - Ariën -
Linkje voor jQuery/Ajax documentatie: http://api.jquery.com/jquery.ajax/
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
2
3
4
5
6
7
8
9
10
11
12
13
<script>
$(document).ready(function(){
loadData();
function loadData() {
$(document).ready(function(){
setInterval(function(){
$("#list").load('shared/loadscript.php?draaiboekID=<? echo $draaiboekID; ?>')
}, 2000);
});
};
</script>
$(document).ready(function(){
loadData();
function loadData() {
$(document).ready(function(){
setInterval(function(){
$("#list").load('shared/loadscript.php?draaiboekID=<? echo $draaiboekID; ?>')
}, 2000);
});
};
</script>
Om ervoor te `zorgen dat de div meteen bij het openen van de pagina laadt en daarna om de 2 seconden herladen wordt. Maar het werkt zo niet... Hoe kan ik het fixen?
- Ariën - op 13/01/2016 23:20:26:
Een functie maken die zich met setInterval recursief aanroept.
Zie je vorige topic. Echter gebruik je dan GET i.p.v. POST. En als deze 'succes' is roept hij zich vanzelf opnieuw aan.
Zie je vorige topic. Echter gebruik je dan GET i.p.v. POST. En als deze 'succes' is roept hij zich vanzelf opnieuw aan.
Hoe bedoel je recursief maken? Want ik heb geprobeerd om mijn oude topic hierin te verwerken, maar weet niet hoe :(
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
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
<?php
error_reporting(E_ALL);
$itemID= '17';
?>
<html>
<head>
<script type="text/javascript" src="https://code.jquery.com/jquery-2.2.0.js"></script>
</head>
<body>
<script type="text/javascript">var itemID= '<?php echo $itemID; ?>';</script>
<script>
$(document).ready(function(){
loadData(itemID);
function loadData(itemID) {
$(document).ready(function(){
setInterval(function(){
$("#list").load('shared/loadscript.php?draaiboekID=<? echo $draaiboekID; ?>')
}, 2000);
});
$.ajax({
url: "shared/loadscript.php",
type: "GET",
data: {itemID: id},
cache: false,
success: function(html){
$(".result").empty().html(html);
setTimeout(function () {
loadData(id);
}, 3000);
},
error:function (xhr, ajaxOptions, thrownError){
$(".result").empty().html('Error:'+ xhr.status + ' '+ thrownError);
}
});
}
});
</script>
</body>
</html>
error_reporting(E_ALL);
$itemID= '17';
?>
<html>
<head>
<script type="text/javascript" src="https://code.jquery.com/jquery-2.2.0.js"></script>
</head>
<body>
<script type="text/javascript">var itemID= '<?php echo $itemID; ?>';</script>
<script>
$(document).ready(function(){
loadData(itemID);
function loadData(itemID) {
$(document).ready(function(){
setInterval(function(){
$("#list").load('shared/loadscript.php?draaiboekID=<? echo $draaiboekID; ?>')
}, 2000);
});
$.ajax({
url: "shared/loadscript.php",
type: "GET",
data: {itemID: id},
cache: false,
success: function(html){
$(".result").empty().html(html);
setTimeout(function () {
loadData(id);
}, 3000);
},
error:function (xhr, ajaxOptions, thrownError){
$(".result").empty().html('Error:'+ xhr.status + ' '+ thrownError);
}
});
}
});
</script>
</body>
</html>
Je moet de AJAXresponse wel ergens tonen ;-)
Die load() functie is dubbelop.
Gewijzigd op 14/01/2016 20:43:04 door - Ariën -
Je setInterval met je load-functie kan weg. Deze is 'dom' en weet zelf niet of een request namelijk gelukt is. $.Ajax() kan dat overigens wel met zijn 'success' of 'error' events.
Als je het goed hebt gedaan heb je alleen nog binnen de ready je loadData functie over met daarin je ajax() functie.
Dan moet je daarna nog even het HTML-element creëren waarin je jouw data in toont.
Gewijzigd op 14/01/2016 21:02:24 door - Ariën -