Ajax jquery omzetten naar json
Zelf heb ik ajax jquery code al geschreven alleen weet niet hoe ik het kan omzetten naar json.
Dit is mijn code index.tpl.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
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
<!DOCTYPE html>
<html>
<body>
<center><h2>Formulier</h2>
<form method="post" action="/leren">
Email:
<input type="text" id="email" name="email" class="resend-tickets-input"></p>
<br>
Ordernummer:
<input type="text" id="order-hash" name="order-hash" class="resend-tickets-input"></p>
<br><br>
</form>
<button type="submit" class="green-button icon-button">
<svg style="width:24px;height:24px" viewBox="0 0 24 24">
<path fill="#000000" d="M2,21L23,12L2,3V10L17,12L2,14V21Z"></path>
</svg>
Verzenden
</button>
</center>
<script>
$(document).ready(function(){
console.log("eey");
$("button").click(function(){
$.ajax({
type:'POST',
url: '/leren',
dataType:'json',
data:{"email": $('#email').val() , "order-hash": $('#order-hash').val(),},
success: function(data){
alert(data);
}});
});
});
</script>
</body>
</html>
<html>
<body>
<center><h2>Formulier</h2>
<form method="post" action="/leren">
Email:
<input type="text" id="email" name="email" class="resend-tickets-input"></p>
<br>
Ordernummer:
<input type="text" id="order-hash" name="order-hash" class="resend-tickets-input"></p>
<br><br>
</form>
<button type="submit" class="green-button icon-button">
<svg style="width:24px;height:24px" viewBox="0 0 24 24">
<path fill="#000000" d="M2,21L23,12L2,3V10L17,12L2,14V21Z"></path>
</svg>
Verzenden
</button>
</center>
<script>
$(document).ready(function(){
console.log("eey");
$("button").click(function(){
$.ajax({
type:'POST',
url: '/leren',
dataType:'json',
data:{"email": $('#email').val() , "order-hash": $('#order-hash').val(),},
success: function(data){
alert(data);
}});
});
});
</script>
</body>
</html>
Mijn controller index.ctr.php:
Code (php)
Edit:
Ik heb code-tags geplaatst. Gelieve dit in het vervolg zelf toe te voegen aan je bericht.
Zie ook: Veel gestelde vragen: Welke UBB-codes kan ik gebruiken.
Zie ook: Veel gestelde vragen: Welke UBB-codes kan ik gebruiken.
Gewijzigd op 05/04/2018 10:20:10 door - Ariën -
Kijk eens naar: json_encode en GetJson
Gewijzigd op 05/04/2018 10:04:12 door - Ariën -
Dit is mijn index.tpl.php:
<!DOCTYPE html>
<html>
<body>
<center><h2>Formulier</h2>
<form method="post" action="/leren">
Email:
<input type="text" id="email" name="email" class="resend-tickets-input"></p>
<br>
Ordernummer:
<input type="text" id="order-hash" name="order-hash" class="resend-tickets-input"></p>
<br><br>
</form>
<button type="submit" class="green-button icon-button">
<svg style="width:24px;height:24px" viewBox="0 0 24 24">
<path fill="#000000" d="M2,21L23,12L2,3V10L17,12L2,14V21Z"></path>
</svg>
Verzenden
</button>
</center>
<script>
$(document).ready(function(){
$("button").click(function(){
$.ajax({
type:'POST',
url: '/leren',
dataType:'json',
data:{"email": $('#email').val() , "order-hash": $('#order-hash').val(),},
success: function(data){
alert(data);
console.debug(data)
}});
});
});
</script>
</body>
</html>
Mijn controller index.ctr.php:
Code (php)
Waarom gebruik je geen console.log(data) i.p.v. alert(data)? Een alert kan niet zomaar een object weergeven, dus eigenlijk is de output die je nu krijgt correct.
Als je perse alert wilt gebruiken kun je misschien data omzetten naar een string.
Code (php)
1
2
3
2
3
var response = JSON.stringify(data);
alert(response);
alert(response);
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
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
<?
<!DOCTYPE html>
<html>
<body>
<center><h2>Formulier</h2>
<form method="post" action="/leren">
Email:
<input type="text" id="email" name="email" class="resend-tickets-input"></p>
<br>
Ordernummer:
<input type="text" id="order-hash" name="order-hash" class="resend-tickets-input"></p>
<br><br>
</form>
<button type="submit" class="green-button icon-button">
<svg style="width:24px;height:24px" viewBox="0 0 24 24">
<path fill="#000000" d="M2,21L23,12L2,3V10L17,12L2,14V21Z"></path>
</svg>
Verzenden
</button>
</center>
<script>
$(document).ready(function(){
$("button").click(function(){
$.ajax({
type:'POST',
url: '/leren',
dataType:'json',
data:{"email": $('#email').val() , "order-hash": $('#order-hash').val(),},
success: function(data){
alert(data);
}});
});
});
</script>
</body>
</html>
?>
<!DOCTYPE html>
<html>
<body>
<center><h2>Formulier</h2>
<form method="post" action="/leren">
Email:
<input type="text" id="email" name="email" class="resend-tickets-input"></p>
<br>
Ordernummer:
<input type="text" id="order-hash" name="order-hash" class="resend-tickets-input"></p>
<br><br>
</form>
<button type="submit" class="green-button icon-button">
<svg style="width:24px;height:24px" viewBox="0 0 24 24">
<path fill="#000000" d="M2,21L23,12L2,3V10L17,12L2,14V21Z"></path>
</svg>
Verzenden
</button>
</center>
<script>
$(document).ready(function(){
$("button").click(function(){
$.ajax({
type:'POST',
url: '/leren',
dataType:'json',
data:{"email": $('#email').val() , "order-hash": $('#order-hash').val(),},
success: function(data){
alert(data);
}});
});
});
</script>
</body>
</html>
?>
En dit is index.ctrl.php (controller):
Code (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
32
33
34
35
36
37
38
39
40
41
42
43
44
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
<?
<!DOCTYPE html>
<html>
<body>
<center><h2>Formulier</h2>
<form method="post" action="/leren">
Email:
<input type="text" id="email" name="email" class="resend-tickets-input"></p>
<br>
Ordernummer:
<input type="text" id="order-hash" name="order-hash" class="resend-tickets-input"></p>
<br><br>
</form>
<button type="submit" class="green-button icon-button">
<svg style="width:24px;height:24px" viewBox="0 0 24 24">
<path fill="#000000" d="M2,21L23,12L2,3V10L17,12L2,14V21Z"></path>
</svg>
Verzenden
</button>
</center>
<script>
$(document).ready(function(){
$("button").click(function(){
$.ajax({
type:'POST',
url: '/leren',
dataType:'json',
data:{"email": $('#email').val() , "order-hash": $('#order-hash').val(),},
success: function(data){
alert(data);
console.log(data);
}});
});
});
</script>
</body>
</html>
?>
<!DOCTYPE html>
<html>
<body>
<center><h2>Formulier</h2>
<form method="post" action="/leren">
Email:
<input type="text" id="email" name="email" class="resend-tickets-input"></p>
<br>
Ordernummer:
<input type="text" id="order-hash" name="order-hash" class="resend-tickets-input"></p>
<br><br>
</form>
<button type="submit" class="green-button icon-button">
<svg style="width:24px;height:24px" viewBox="0 0 24 24">
<path fill="#000000" d="M2,21L23,12L2,3V10L17,12L2,14V21Z"></path>
</svg>
Verzenden
</button>
</center>
<script>
$(document).ready(function(){
$("button").click(function(){
$.ajax({
type:'POST',
url: '/leren',
dataType:'json',
data:{"email": $('#email').val() , "order-hash": $('#order-hash').val(),},
success: function(data){
alert(data);
console.log(data);
}});
});
});
</script>
</body>
</html>
?>
controller:
Maar er moet alleen email en ordernummer te voorschijn komen. dit zie ik nu in alert {"email":"test@test","order-hash":"ggghg"} en het moet alleen test@test ggghg zijn
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
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
<?
<!DOCTYPE html>
<html>
<body>
<center><h2>Formulier</h2>
<form method="post" action="/leren">
Email:
<input type="text" id="email" name="email" class="resend-tickets-input"></p>
<br>
Ordernummer:
<input type="text" id="order-hash" name="order-hash" class="resend-tickets-input"></p>
<br><br>
</form>
<button type="submit" class="green-button icon-button">
<svg style="width:24px;height:24px" viewBox="0 0 24 24">
<path fill="#000000" d="M2,21L23,12L2,3V10L17,12L2,14V21Z"></path>
</svg>
Verzenden
</button>
</center>
<script>
$(document).ready(function(){
$("button").click(function(){
$.ajax({
type:'POST',
url: '/leren',
dataType:'json',
data:{"email": $('#email').val() , "order-hash": $('#order-hash').val(),},
success: function(data){
var gegevens = JSON.stringify(data);
alert(gegevens);
console.log(data);
}});
});
});
</script>
</body>
</html>
?>
<!DOCTYPE html>
<html>
<body>
<center><h2>Formulier</h2>
<form method="post" action="/leren">
Email:
<input type="text" id="email" name="email" class="resend-tickets-input"></p>
<br>
Ordernummer:
<input type="text" id="order-hash" name="order-hash" class="resend-tickets-input"></p>
<br><br>
</form>
<button type="submit" class="green-button icon-button">
<svg style="width:24px;height:24px" viewBox="0 0 24 24">
<path fill="#000000" d="M2,21L23,12L2,3V10L17,12L2,14V21Z"></path>
</svg>
Verzenden
</button>
</center>
<script>
$(document).ready(function(){
$("button").click(function(){
$.ajax({
type:'POST',
url: '/leren',
dataType:'json',
data:{"email": $('#email').val() , "order-hash": $('#order-hash').val(),},
success: function(data){
var gegevens = JSON.stringify(data);
alert(gegevens);
console.log(data);
}});
});
});
</script>
</body>
</html>
?>
Toevoeging op 05/04/2018 14:32:26:
met alert(data.email) heb ik alleen email gekregen ik moet nu ordernummer doen
Toevoeging op 05/04/2018 14:34:58:
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<?
<script>
$(document).ready(function(){
$("button").click(function(){
$.ajax({
type:'POST',
url: '/leren',
dataType:'json',
data:{"email": $('#email').val() , "order-hash": $('#order-hash').val(),},
success: function(data){
alert(data.email);
console.log(data);
}});
});
});
</script>
?>
<script>
$(document).ready(function(){
$("button").click(function(){
$.ajax({
type:'POST',
url: '/leren',
dataType:'json',
data:{"email": $('#email').val() , "order-hash": $('#order-hash').val(),},
success: function(data){
alert(data.email);
console.log(data);
}});
});
});
</script>
?>
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<?
<script>
$(document).ready(function(){
$("button").click(function(){
$.ajax({
type:'POST',
url: '/leren',
dataType:'json',
data:{"email": $('#email').val() , "order-hash": $('#order-hash').val(),},
success: function(data){
alert(data.email, data.order-hash);
console.log(data);
}});
});
});
</script>
?>
<script>
$(document).ready(function(){
$("button").click(function(){
$.ajax({
type:'POST',
url: '/leren',
dataType:'json',
data:{"email": $('#email').val() , "order-hash": $('#order-hash').val(),},
success: function(data){
alert(data.email, data.order-hash);
console.log(data);
}});
});
});
</script>
?>
Toevoeging op 05/04/2018 14:58:04:
Het werkt nu.
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<?
<script>
$(document).ready(function(){
$("button").click(function(){
$.ajax({
type:'POST',
url: '/leren',
dataType:'json',
data:{"email": $('#email').val() , "order-hash": $('#order-hash').val(),},
success: function(data){
alert(data["email"] + " " + data["order-hash"]);
console.log(data);
}});
});
});
</script>
?>
<script>
$(document).ready(function(){
$("button").click(function(){
$.ajax({
type:'POST',
url: '/leren',
dataType:'json',
data:{"email": $('#email').val() , "order-hash": $('#order-hash').val(),},
success: function(data){
alert(data["email"] + " " + data["order-hash"]);
console.log(data);
}});
});
});
</script>
?>