AJAX request stop zetten
Momenteel haal ik een tabel op dmv Ajax:
Code (php)
1
2
3
4
5
6
7
8
9
2
3
4
5
6
7
8
9
function getStatus() {
$.getJSON('getinfo_bug.php?Bug=<?php echo $_GET['id']; ?>', function(data) {
$('div#status').html(data.status);
$('div#lastupdate').html(data.lastupdate);
});
setTimeout("getStatus()",1000);
}
$.getJSON('getinfo_bug.php?Bug=<?php echo $_GET['id']; ?>', function(data) {
$('div#status').html(data.status);
$('div#lastupdate').html(data.lastupdate);
});
setTimeout("getStatus()",1000);
}
Hierbij is $id:
De code van getinfo_bug.php ziet er zo uit:
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
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
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
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
<?php
session_start();
include '../conn.php';
if(!isset($_SESSION['Admin_WD'])){
include 'login.php';
exit();
}
$se = mysql_query("SELECT * FROM bugs AS b LEFT JOIN bugs_reacties AS c ON b.ID = c.Bug_ID WHERE b.ID='".mysql_real_escape_string($_GET['Bug'])."'");
$se2 = mysql_num_rows(mysql_query("SELECT * FROM bugs_reacties WHERE Bug_ID='".mysql_real_escape_string($_GET['Bug'])."' AND Rep = '1'"));
while($row = mysql_fetch_array($se)){
$aReturn['status'] = '<script>function myFunction(){
var lblValue = document.getElementById("Invoerer");
lblValue.innerHTML = "<input type=text name=Invoerer value='.$row['Invoerer'].'><input type=submit name=send value=Opslaan>";
}
</script>
<!-- General Information --><div class="row" width="95%"><div class="col-lg-12" width="95%"><div width="95%" class="table-responsive"><table class="table table-bordered table-hover tablesorter" width="95%"><tbody><tr><td width="15%"><b>Invoerder</b></td>
<td width="70%"><div id="Invoerer">'.$row['Invoerer'].'</div></td>
<td width="15%"><button type="submit" class="btn btn-primary" onclick="myFunction();">Bewerk</button></td>
</tr>
<tr>
<td width="15%"><b>Datum</b></td>
<td width="70%">'.$row['Ingevoerd'].'</td>
<td width="15%"><fieldset disabled><button type="submit" class="btn btn-primary">Bewerk</button></fieldset></td>
</tr>
<tr>
<td width="15%"><b>Versie</b></td>
<td width="70%">'.$row['Versies'].'</td>
<td width="15%"><fieldset disabled><button type="submit" class="btn btn-primary">Bewerk</button></fieldset></td>
</tr>
<tr>
<td width="15%"><b>Gereproduceerd</b></td>
<td width="70%">'.$se2.'x</td>
<td width="15%"><fieldset disabled><button type="submit" class="btn btn-primary">Bewerk</button></fieldset></td>
</tr>
<tr>
<td width="15%"><b>Browser</b></td>
<td width="70%">'.$row['Browser'].'</td>
<td width="15%"><fieldset disabled><button type="submit" class="btn btn-primary">Bewerk</button></fieldset></td>
</tr>
<tr>
<td width="15%"><b>Prioriteit</b></td>
<td width="70%">'.$row['Prioriteit'].'</td>
<td width="15%"><button type="submit" class="btn btn-primary">Bewerk</button></td>
</tr>
<tr>
<td width="15%"><b>Premium/Scripts</b></td>
<td width="70%">';
if($row['Prem_1'] == '1'){ $aa = 'Ja'; } else { $aa = 'Nee'; }
if($row['Prem_2'] == '1'){ $bb = 'Ja'; } else { $bb = 'Nee'; }
if($row['Prem_3'] == '1'){ $cc = 'Ja'; } else { $cc = 'Nee'; }
if($row['Prem_4'] == '1'){ $dd = 'Ja'; } else { $dd = 'Nee'; }
if($row['Prem_5'] == '1'){ $ee = 'Ja'; } else { $ee = 'Nee'; }
if($row['Scripts'] == '1'){ $ff = 'Ja'; } else { $ff = 'Nee'; }
$aReturn['status'] .= '1: '.$aa.', 2: '.$bb.', 3:'.$cc.', 4:'.$dd.', 5: '.$ee.' S:'.$ff.'</td>
<td width="15%"><fieldset disabled><button type="submit" class="btn btn-primary" id="submit_button" name="submit_button">Bewerk</button></fieldset>
</td>
</tr>
<tr>
<td width="15%"><b>Status</b></td>
<td width="70%">'.$row['Status'].'</td>
<td width="15%"><button type="submit" class="btn btn-primary">Bewerk</button>
</td>
<tr>
<td width="15%"><b>Onderwerp</b></td>
<td>'.$row['Onderwerp'].'</td>
<td width="15%"><fieldset disabled><button type="submit" class="btn btn-primary" id="submit_button" name="submit_button">Bewerk</button></fieldset></td>
</tr>
<tr>
<td width="15%"><b>Omschrijving</b></td>
<td width="70%">'.$row['Omschrijving'].'</td>
<td width="15%"><fieldset disabled><button type="submit" class="btn btn-primary" id="submit_button" name="submit_button">Bewerk</button></fieldset></td>
</tr>
</tbody>
</table>
</div>
</div>
</div>';
}
echo json_encode($aReturn);
?>
session_start();
include '../conn.php';
if(!isset($_SESSION['Admin_WD'])){
include 'login.php';
exit();
}
$se = mysql_query("SELECT * FROM bugs AS b LEFT JOIN bugs_reacties AS c ON b.ID = c.Bug_ID WHERE b.ID='".mysql_real_escape_string($_GET['Bug'])."'");
$se2 = mysql_num_rows(mysql_query("SELECT * FROM bugs_reacties WHERE Bug_ID='".mysql_real_escape_string($_GET['Bug'])."' AND Rep = '1'"));
while($row = mysql_fetch_array($se)){
$aReturn['status'] = '<script>function myFunction(){
var lblValue = document.getElementById("Invoerer");
lblValue.innerHTML = "<input type=text name=Invoerer value='.$row['Invoerer'].'><input type=submit name=send value=Opslaan>";
}
</script>
<!-- General Information --><div class="row" width="95%"><div class="col-lg-12" width="95%"><div width="95%" class="table-responsive"><table class="table table-bordered table-hover tablesorter" width="95%"><tbody><tr><td width="15%"><b>Invoerder</b></td>
<td width="70%"><div id="Invoerer">'.$row['Invoerer'].'</div></td>
<td width="15%"><button type="submit" class="btn btn-primary" onclick="myFunction();">Bewerk</button></td>
</tr>
<tr>
<td width="15%"><b>Datum</b></td>
<td width="70%">'.$row['Ingevoerd'].'</td>
<td width="15%"><fieldset disabled><button type="submit" class="btn btn-primary">Bewerk</button></fieldset></td>
</tr>
<tr>
<td width="15%"><b>Versie</b></td>
<td width="70%">'.$row['Versies'].'</td>
<td width="15%"><fieldset disabled><button type="submit" class="btn btn-primary">Bewerk</button></fieldset></td>
</tr>
<tr>
<td width="15%"><b>Gereproduceerd</b></td>
<td width="70%">'.$se2.'x</td>
<td width="15%"><fieldset disabled><button type="submit" class="btn btn-primary">Bewerk</button></fieldset></td>
</tr>
<tr>
<td width="15%"><b>Browser</b></td>
<td width="70%">'.$row['Browser'].'</td>
<td width="15%"><fieldset disabled><button type="submit" class="btn btn-primary">Bewerk</button></fieldset></td>
</tr>
<tr>
<td width="15%"><b>Prioriteit</b></td>
<td width="70%">'.$row['Prioriteit'].'</td>
<td width="15%"><button type="submit" class="btn btn-primary">Bewerk</button></td>
</tr>
<tr>
<td width="15%"><b>Premium/Scripts</b></td>
<td width="70%">';
if($row['Prem_1'] == '1'){ $aa = 'Ja'; } else { $aa = 'Nee'; }
if($row['Prem_2'] == '1'){ $bb = 'Ja'; } else { $bb = 'Nee'; }
if($row['Prem_3'] == '1'){ $cc = 'Ja'; } else { $cc = 'Nee'; }
if($row['Prem_4'] == '1'){ $dd = 'Ja'; } else { $dd = 'Nee'; }
if($row['Prem_5'] == '1'){ $ee = 'Ja'; } else { $ee = 'Nee'; }
if($row['Scripts'] == '1'){ $ff = 'Ja'; } else { $ff = 'Nee'; }
$aReturn['status'] .= '1: '.$aa.', 2: '.$bb.', 3:'.$cc.', 4:'.$dd.', 5: '.$ee.' S:'.$ff.'</td>
<td width="15%"><fieldset disabled><button type="submit" class="btn btn-primary" id="submit_button" name="submit_button">Bewerk</button></fieldset>
</td>
</tr>
<tr>
<td width="15%"><b>Status</b></td>
<td width="70%">'.$row['Status'].'</td>
<td width="15%"><button type="submit" class="btn btn-primary">Bewerk</button>
</td>
<tr>
<td width="15%"><b>Onderwerp</b></td>
<td>'.$row['Onderwerp'].'</td>
<td width="15%"><fieldset disabled><button type="submit" class="btn btn-primary" id="submit_button" name="submit_button">Bewerk</button></fieldset></td>
</tr>
<tr>
<td width="15%"><b>Omschrijving</b></td>
<td width="70%">'.$row['Omschrijving'].'</td>
<td width="15%"><fieldset disabled><button type="submit" class="btn btn-primary" id="submit_button" name="submit_button">Bewerk</button></fieldset></td>
</tr>
</tbody>
</table>
</div>
</div>
</div>';
}
echo json_encode($aReturn);
?>
Nu zie je op Regel 11 een Javascript deel staan, waarbij een Administrator op de "Bewerk" knop rechts kan klikken en er zo een tekstvak komt te staan. Ik kan deze versturen met Ajax (Ik weet hoe), maar het script reload elke seconde waardoor het tekstvak een seconde blijft staan en weer verdwijnt in de naam.
Het ziet er zo uit als tekst: (Hier komt de omschrijving onder, past niet op mijn scherm)
Nu is mijn vraag dus: Ik moet het ophalen stop kunnen zetten en na het klikken op de opslaan toets deze weer verder laten gaan. Een extra vraag is: Hoe kan ik de "/' bij de HTML op regel 11 netjes neerzetten zonder dat ik een error krijg? " breekt de JS af, ' breekt de echo af.
Groet,
Peter Flos.
Gewijzigd op 23/05/2014 08:37:56 door Peter Flos
Dan kun je namelijk je interval laten lopen, en uit zetten op het moment dat op bewerk word geklikt met een clearInterval stoppen.
Vervolgens kun je als de bewerking klaar is (dus bijvoorbeeld als er op een knop word geklikt) je interval weer aan zetten :)
Voorbeeld interval :
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
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
<html>
<head>
<script type="text/javascript">
var intervalGlobal ;
function startInterval() {
var timer = 0 ;
document.getElementById("timer").innerHTML = timer ;
intervalGlobal = setInterval(function(){
timer = timer + 1;
document.getElementById("timer").innerHTML = timer ;
} , 1000);
}
function stopInterval (){
clearInterval(intervalGlobal)
}
</script>
</head>
<body>
Interval loopt <span id="timer">0</span> seconden<br />
<input type="button" value="Start" onClick="startInterval()" />
<input type="button" value="Stop" onClick="stopInterval()" />
</body>
</html>
<head>
<script type="text/javascript">
var intervalGlobal ;
function startInterval() {
var timer = 0 ;
document.getElementById("timer").innerHTML = timer ;
intervalGlobal = setInterval(function(){
timer = timer + 1;
document.getElementById("timer").innerHTML = timer ;
} , 1000);
}
function stopInterval (){
clearInterval(intervalGlobal)
}
</script>
</head>
<body>
Interval loopt <span id="timer">0</span> seconden<br />
<input type="button" value="Start" onClick="startInterval()" />
<input type="button" value="Stop" onClick="stopInterval()" />
</body>
</html>
Gewijzigd op 23/05/2014 10:11:16 door Jacco Engel
Momenteel heb ik het script aangepast:
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
2
3
4
5
6
7
8
9
10
11
12
<script type="text/javascript">
$(document).ready(function(){
getStatus();
});
function getStatus() {
$.getJSON('getinfo_bug.php?Bug=<?php echo $_GET['id']; ?>', function(data) {
$('div#status').html(data.status);
});
var come = setInterval("getStatus()",1000);
}
</script>
$(document).ready(function(){
getStatus();
});
function getStatus() {
$.getJSON('getinfo_bug.php?Bug=<?php echo $_GET['id']; ?>', function(data) {
$('div#status').html(data.status);
});
var come = setInterval("getStatus()",1000);
}
</script>
Ik heb een var toegevoegd met even de naam "come". Nu moet ik deze dus clearen met clearInterval(come);.
Gezien het nodig is om het gehele (nieuwe) script te tonen post ik deze onderaan deze reactie.
De belangrijkste regel pak ik eruit:
Code (php)
1
<button type="submit" class="btn btn-primary" onclick="myFunction(); clearInterval(come);">Bewerk</button>
Deze roept het textveld aan met de submit knop en zou de interval moeten clearen, maar dat doet ie niet, iemand enig idee waarom niet? Even voor de duidelijkheid: De pagina waarop het komt is bugs.php, de pagina die opgevraagd wordt (zie onderaan) heet getinfo_bug.php.
Alvast bedankt.
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
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
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
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
<?php
session_start();
include '../conn.php';
if(!isset($_SESSION['Admin_WD'])){
include 'login.php';
exit();
}
$se = mysql_query("SELECT * FROM bugs AS b LEFT JOIN bugs_reacties AS c ON b.ID = c.Bug_ID WHERE b.ID='".mysql_real_escape_string($_GET['Bug'])."'");
$se2 = mysql_num_rows(mysql_query("SELECT * FROM bugs_reacties WHERE Bug_ID='".mysql_real_escape_string($_GET['Bug'])."' AND Rep = '1'"));
while($row = mysql_fetch_array($se)){
$aReturn['status'] = '<script type="text/javascript">function myFunction(){
var lblValue = document.getElementById("Invoerer");
lblValue.innerHTML = "<input type=text name=Invoerer value='.$row['Invoerer'].'><input type=submit name=send value=Opslaan>";
}
</script>
<!-- General Information --><div class="row" width="95%"><div class="col-lg-12" width="95%"><div width="95%" class="table-responsive"><table class="table table-bordered table-hover tablesorter" width="95%"><tbody><tr><td width="15%"><b>Invoerder</b></td>
<td width="70%"><div id="Invoerer">'.$row['Invoerer'].'</div></td>
<td width="15%"><button type="submit" class="btn btn-primary" onclick="myFunction(); clearInterval(come);">Bewerk</button></td>
</tr>
<tr>
<td width="15%"><b>Datum</b></td>
<td width="70%">'.$row['Ingevoerd'].'</td>
<td width="15%"><fieldset disabled><button type="submit" class="btn btn-primary">Bewerk</button></fieldset></td>
</tr>
<tr>
<td width="15%"><b>Versie</b></td>
<td width="70%">'.$row['Versies'].'</td>
<td width="15%"><fieldset disabled><button type="submit" class="btn btn-primary">Bewerk</button></fieldset></td>
</tr>
<tr>
<td width="15%"><b>Gereproduceerd</b></td>
<td width="70%">'.$se2.'x</td>
<td width="15%"><fieldset disabled><button type="submit" class="btn btn-primary">Bewerk</button></fieldset></td>
</tr>
<tr>
<td width="15%"><b>Browser</b></td>
<td width="70%">'.$row['Browser'].'</td>
<td width="15%"><fieldset disabled><button type="submit" class="btn btn-primary">Bewerk</button></fieldset></td>
</tr>
<tr>
<td width="15%"><b>Prioriteit</b></td>
<td width="70%">'.$row['Prioriteit'].'</td>
<td width="15%"><button type="submit" class="btn btn-primary">Bewerk</button></td>
</tr>
<tr>
<td width="15%"><b>Premium/Scripts</b></td>
<td width="70%">';
if($row['Prem_1'] == '1'){ $aa = 'Ja'; } else { $aa = 'Nee'; }
if($row['Prem_2'] == '1'){ $bb = 'Ja'; } else { $bb = 'Nee'; }
if($row['Prem_3'] == '1'){ $cc = 'Ja'; } else { $cc = 'Nee'; }
if($row['Prem_4'] == '1'){ $dd = 'Ja'; } else { $dd = 'Nee'; }
if($row['Prem_5'] == '1'){ $ee = 'Ja'; } else { $ee = 'Nee'; }
if($row['Scripts'] == '1'){ $ff = 'Ja'; } else { $ff = 'Nee'; }
$aReturn['status'] .= '1: '.$aa.', 2: '.$bb.', 3:'.$cc.', 4:'.$dd.', 5: '.$ee.' S:'.$ff.'</td>
<td width="15%"><fieldset disabled><button type="submit" class="btn btn-primary" id="submit_button" name="submit_button">Bewerk</button></fieldset>
</td>
</tr>
<tr>
<td width="15%"><b>Status</b></td>
<td width="70%">'.$row['Status'].'</td>
<td width="15%"><button type="submit" class="btn btn-primary">Bewerk</button>
</td>
<tr>
<td width="15%"><b>Onderwerp</b></td>
<td>'.$row['Onderwerp'].'</td>
<td width="15%"><fieldset disabled><button type="submit" class="btn btn-primary" id="submit_button" name="submit_button">Bewerk</button></fieldset></td>
</tr>
<tr>
<td width="15%"><b>Omschrijving</b></td>
<td width="70%">'.$row['Omschrijving'].'</td>
<td width="15%"><fieldset disabled><button type="submit" class="btn btn-primary" id="submit_button" name="submit_button">Bewerk</button></fieldset></td>
</tr>
</tbody>
</table>
</div>
</div>
</div>';
}
echo json_encode($aReturn);
?>
session_start();
include '../conn.php';
if(!isset($_SESSION['Admin_WD'])){
include 'login.php';
exit();
}
$se = mysql_query("SELECT * FROM bugs AS b LEFT JOIN bugs_reacties AS c ON b.ID = c.Bug_ID WHERE b.ID='".mysql_real_escape_string($_GET['Bug'])."'");
$se2 = mysql_num_rows(mysql_query("SELECT * FROM bugs_reacties WHERE Bug_ID='".mysql_real_escape_string($_GET['Bug'])."' AND Rep = '1'"));
while($row = mysql_fetch_array($se)){
$aReturn['status'] = '<script type="text/javascript">function myFunction(){
var lblValue = document.getElementById("Invoerer");
lblValue.innerHTML = "<input type=text name=Invoerer value='.$row['Invoerer'].'><input type=submit name=send value=Opslaan>";
}
</script>
<!-- General Information --><div class="row" width="95%"><div class="col-lg-12" width="95%"><div width="95%" class="table-responsive"><table class="table table-bordered table-hover tablesorter" width="95%"><tbody><tr><td width="15%"><b>Invoerder</b></td>
<td width="70%"><div id="Invoerer">'.$row['Invoerer'].'</div></td>
<td width="15%"><button type="submit" class="btn btn-primary" onclick="myFunction(); clearInterval(come);">Bewerk</button></td>
</tr>
<tr>
<td width="15%"><b>Datum</b></td>
<td width="70%">'.$row['Ingevoerd'].'</td>
<td width="15%"><fieldset disabled><button type="submit" class="btn btn-primary">Bewerk</button></fieldset></td>
</tr>
<tr>
<td width="15%"><b>Versie</b></td>
<td width="70%">'.$row['Versies'].'</td>
<td width="15%"><fieldset disabled><button type="submit" class="btn btn-primary">Bewerk</button></fieldset></td>
</tr>
<tr>
<td width="15%"><b>Gereproduceerd</b></td>
<td width="70%">'.$se2.'x</td>
<td width="15%"><fieldset disabled><button type="submit" class="btn btn-primary">Bewerk</button></fieldset></td>
</tr>
<tr>
<td width="15%"><b>Browser</b></td>
<td width="70%">'.$row['Browser'].'</td>
<td width="15%"><fieldset disabled><button type="submit" class="btn btn-primary">Bewerk</button></fieldset></td>
</tr>
<tr>
<td width="15%"><b>Prioriteit</b></td>
<td width="70%">'.$row['Prioriteit'].'</td>
<td width="15%"><button type="submit" class="btn btn-primary">Bewerk</button></td>
</tr>
<tr>
<td width="15%"><b>Premium/Scripts</b></td>
<td width="70%">';
if($row['Prem_1'] == '1'){ $aa = 'Ja'; } else { $aa = 'Nee'; }
if($row['Prem_2'] == '1'){ $bb = 'Ja'; } else { $bb = 'Nee'; }
if($row['Prem_3'] == '1'){ $cc = 'Ja'; } else { $cc = 'Nee'; }
if($row['Prem_4'] == '1'){ $dd = 'Ja'; } else { $dd = 'Nee'; }
if($row['Prem_5'] == '1'){ $ee = 'Ja'; } else { $ee = 'Nee'; }
if($row['Scripts'] == '1'){ $ff = 'Ja'; } else { $ff = 'Nee'; }
$aReturn['status'] .= '1: '.$aa.', 2: '.$bb.', 3:'.$cc.', 4:'.$dd.', 5: '.$ee.' S:'.$ff.'</td>
<td width="15%"><fieldset disabled><button type="submit" class="btn btn-primary" id="submit_button" name="submit_button">Bewerk</button></fieldset>
</td>
</tr>
<tr>
<td width="15%"><b>Status</b></td>
<td width="70%">'.$row['Status'].'</td>
<td width="15%"><button type="submit" class="btn btn-primary">Bewerk</button>
</td>
<tr>
<td width="15%"><b>Onderwerp</b></td>
<td>'.$row['Onderwerp'].'</td>
<td width="15%"><fieldset disabled><button type="submit" class="btn btn-primary" id="submit_button" name="submit_button">Bewerk</button></fieldset></td>
</tr>
<tr>
<td width="15%"><b>Omschrijving</b></td>
<td width="70%">'.$row['Omschrijving'].'</td>
<td width="15%"><fieldset disabled><button type="submit" class="btn btn-primary" id="submit_button" name="submit_button">Bewerk</button></fieldset></td>
</tr>
</tbody>
</table>
</div>
</div>
</div>';
}
echo json_encode($aReturn);
?>
Gewijzigd op 23/05/2014 18:14:19 door Peter Flos
Toevoeging op 25/05/2014 14:02:49:
Edit:
Op google toch niet op de juiste woorden gezocht, de juiste oplossing is:
setTimeout("getStatus",1000);
ipv
setTimeout("getStatus()",1000);