AJAX: hoe post ik mijn JSON-string?
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
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
<?php
// PHP voor de kleuren
// Validate signup
function validateSignup(){
// Get values
var username = document.getElementById("pm_username").value;
var email = document.getElementById("pm_email").value;
var password = document.getElementById("pm_password").value;
// Make new object
var data = {};
// Make array from object
data['data'] = [];
// If values are not empty...
if(username !== "" || email !== "" || password !== ""){
data['data'].push(email, username, password);
// Convert data to JSON string and make new XMLHttpRequest
var json = JSON.stringify(data['data']), xhr = new XMLHttpRequest();
// Page to open
xhr.open("POST", "ajax/signup.php", true);
// Set header to POST
xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
// Send values
xhr.send(json);
console.log(json);
xhr.onload = function(){
console.log(xhr.responseText);
}
}else{ // ...or throw new exception
throw("Some thing was not filled in!");
}
}
?>
// PHP voor de kleuren
// Validate signup
function validateSignup(){
// Get values
var username = document.getElementById("pm_username").value;
var email = document.getElementById("pm_email").value;
var password = document.getElementById("pm_password").value;
// Make new object
var data = {};
// Make array from object
data['data'] = [];
// If values are not empty...
if(username !== "" || email !== "" || password !== ""){
data['data'].push(email, username, password);
// Convert data to JSON string and make new XMLHttpRequest
var json = JSON.stringify(data['data']), xhr = new XMLHttpRequest();
// Page to open
xhr.open("POST", "ajax/signup.php", true);
// Set header to POST
xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
// Send values
xhr.send(json);
console.log(json);
xhr.onload = function(){
console.log(xhr.responseText);
}
}else{ // ...or throw new exception
throw("Some thing was not filled in!");
}
}
?>
Ik heb van de values dus een JSON-string gemaakt, maar hoe verzend ik die met PHP? $_POST['json'] doet niks en var_dump($_POST) geeft een lege array. Dit is mijn PHP-code:
Hij geeft wel "Test" terug, dus hij bereikt de pagina wel.
Code (php)
1
2
3
4
5
2
3
4
5
<?php
<br />
<b>Notice</b>: Undefined index: json in <b>G:\usbwebserver\root\pokemonisle\ajax\signup.php</b> on line <b>3</b><br />
Test
?>
<br />
<b>Notice</b>: Undefined index: json in <b>G:\usbwebserver\root\pokemonisle\ajax\signup.php</b> on line <b>3</b><br />
Test
?>
Dat geeft hij terug in de console...
Gewijzigd op 20/06/2014 11:24:16 door Mark Markson
Edit: Dat is dus ook het probleem, sorry voor deze nutteloze reactie ;)
Gewijzigd op 20/06/2014 11:44:28 door gerhard l
Code (js)
1
2
3
4
2
3
4
var data = {};
data['data'] = [];
data['data'].push(email, username, password);
var json = JSON.stringify(data['data']);
data['data'] = [];
data['data'].push(email, username, password);
var json = JSON.stringify(data['data']);
Het effect hiervan is dat data['data'] een array is met numerieke keys. Als je dit dus verstuurd, dan krijg je niet een key 'email' in de POST array. Die key bestaat namelijk helemaal niet.
Wat ik zou doen is het volgende:
En vervolgens data versturen (eventueel via stringify geserialiseerd). Dan heb je een javascript object met properties die wel als een key in de POST array terecht zullen komen.
Code (js)
1
2
3
4
5
6
7
8
9
10
11
2
3
4
5
6
7
8
9
10
11
var xhr = new XMLHttpRequest();
var data = "username=" + encodeURI(username) +
"&email=" + encodeURI(email);
xhr.onreadystatechange = function(){
if (xhr.readyState == 4 && xhr.status==200) {
alert (xhr.responseText);
}
}
xhr.open("POST", "ajax/signup.php", true);
xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded; charset=UTF-8");
xhr.send(data)
var data = "username=" + encodeURI(username) +
"&email=" + encodeURI(email);
xhr.onreadystatechange = function(){
if (xhr.readyState == 4 && xhr.status==200) {
alert (xhr.responseText);
}
}
xhr.open("POST", "ajax/signup.php", true);
xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded; charset=UTF-8");
xhr.send(data)
Gewijzigd op 20/06/2014 15:44:39 door Ger van Steenderen