hash met loader
Misschien is het omslachtig maar wil weten of het mogelijk is en hoe het in zijn werk gaat.
Op een pagina heb ik een aantal inputs waar waardes kunnen worden ingevuld.
Deze worden via een php variable opgeslagen.
Uit eindelijk is het de bedoeling dat er een hash sha256 word gemaakt.
deze hash moet dan worden teruggeven an worden getoont op het scherm
Nu komt het gene dat ik graag zou willen maken.
Als deze hash word gemaakt en word terugggeven wil ik een throbber/spinner tonen.
Nu weet ik dat een hash en teruggeef methode snel werkt, echter wil ik gewoon weten hoe ik toch zoiets zou kunnen maken.
Als je het echt graag wilt, dan kan je kijken naar een a-synchrone request (AJAX).
Met het jQuery-framework kan je dan de $.ajax() functie oproepen, en dan kijken naar het success en error event. Daarmee overschrijf je dan een vast plaatje die altijd blijft draaien, totdat de request gelukt is.
Vergeet verder de boel niet even te vertragen met sleep(2);
Gewijzigd op 10/04/2015 00:18:54 door - Ariën -
Dank voor uw reactie.
Hoe kan ik die php variable koppelen aan de ajax?
dit is wat ik heb:
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
De inputs gegevens zijn teruggegeven door php
<html>
<button id="send">Show Content</button><pre>
<div id="content">vul gevens in</div>
</pre>
<input name="naam "val="Bryan de Baar">
<input name="straat" val="test straat 4" >
<input name="postcode"val="5534AC">
<input name="woonplaats"val="amsterdam">
</html>
Nu moeten deze gegevens met een hash achter een link worden gezet wat dan getoont moet worden op het scherm :)
<script>
$(document).ready(function(){
$('#send').click(function () {
$('#content').html('<div id="loader">Loading...</div>');
$.ajax({
url:is de zelfde pagina,
data:,
success: function (data) {
$('#content').empty();
},
error: function(){
$('#content').empty();
alert('error!');
}
});
});
});
</script>
<html>
<button id="send">Show Content</button><pre>
<div id="content">vul gevens in</div>
</pre>
<input name="naam "val="Bryan de Baar">
<input name="straat" val="test straat 4" >
<input name="postcode"val="5534AC">
<input name="woonplaats"val="amsterdam">
</html>
Nu moeten deze gegevens met een hash achter een link worden gezet wat dan getoont moet worden op het scherm :)
<script>
$(document).ready(function(){
$('#send').click(function () {
$('#content').html('<div id="loader">Loading...</div>');
$.ajax({
url:is de zelfde pagina,
data:,
success: function (data) {
$('#content').empty();
},
error: function(){
$('#content').empty();
alert('error!');
}
});
});
});
</script>
Quote:
url:is de zelfde pagina,
Hoe zie je dit voor je? Die url moet toch op een of andere manier (enkel) een hash teruggeven?
Quote:
data:,
Je geeft niets mee aan de url :/.
Quote:
success: function (data) {
$('#content').empty();
},
$('#content').empty();
},
Je doet niets met de data die terugkomt :/.
Verder klopt er weinig van de structuur van het bovenstaande HTML-document.
En ook is er dus geen script wat een hash bepaalt.
Trouwens, je hebt een soortgelijke vraag al eerder gesteld, en deze is ook al eerder beantwoord.
:/
In het script word inderdaad nog niets gedaan met de data. Ik wil alleen weten hoe ik mijn value's aan ajax mee geef.
Moet ik ook een url meegeven als het om de zelfde pagina gaan waar hij de informatie van moet overnemen?
De data geef je aan in de data-paramater:
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
$.ajax({
url: "ajaxscript.php",
data: {
"dit": "dat",
"zus": "zo"
},
cache: false,
type: "GET",
success: function(response) {
// het is gelukt.
},
error: function(xhr) {
// er gaat wat fout
}
});
url: "ajaxscript.php",
data: {
"dit": "dat",
"zus": "zo"
},
cache: false,
type: "GET",
success: function(response) {
// het is gelukt.
},
error: function(xhr) {
// er gaat wat fout
}
});
klik
Maak een loader plaatje via deze site.
index.htm, zie bron eerste URL.
ajax.php
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<?php
header('Content-Type: application/json; charset=UTF-8');
// doing important stuff
sleep(4);
$return = array(
'cake' => 'NO CAKE',
'hash' => '',
);
if (isset($_GET['name']) && trim($_GET['name']) !== '') {
$return = array(
'cake' => 'CAKE',
'hash' => md5($_GET['name']), // doe maar wat
);
}
echo json_encode($return);
?>
header('Content-Type: application/json; charset=UTF-8');
// doing important stuff
sleep(4);
$return = array(
'cake' => 'NO CAKE',
'hash' => '',
);
if (isset($_GET['name']) && trim($_GET['name']) !== '') {
$return = array(
'cake' => 'CAKE',
'hash' => md5($_GET['name']), // doe maar wat
);
}
echo json_encode($return);
?>
En nu wat zelf gaan proberen plx.