I have a script where ajax is being used to send password to a PHP file. The PHP file then checks if the password is correct and sends back a data of array with a link and succes code. When the data is received, I can clearly see the keys and values when I alert it, but how do I manipulate the key to get the value from it?
See below for an example how I use to communicate jQuery Ajax with PHP:
jQuery Ajax:
$.ajax({
type: "POST",
url: "test.php",
data: { pass: $("#pass-field").val() }
}).done(function(data) {
if(data.link != ""){
alert("Link: " + data.link);
}
});
PHP:
if(strtolower($retrieved_password) == $original_password){
echo json_encode(array("link" => "personal/cv.doc", "success" => "true"));
}else{
echo json_encode(array("link" => "", "success" => "false"));
}
?>
When I alert data.link I get to see the following code:
function link() {
[native code]
}
Your problem is that the response has text/html type on it.
The data variable in your done callback is of type String
You should do eval on it to turn it into an object.
Something like this
$.ajax({
type: "POST",
url: "test.php",
}).done(function(data) {
var dataObj = {};
eval ("dataObj = " + data);
console.log([dataObj]);
});
The best solution of course should be to return a response of type text/json.
This will make the data object of type object.
Anyway - you should make your callbacks support both types like so
$.ajax({
type: "POST",
url: "test.php",
}).done(function(data) {
var dataObj = null;
switch ( typeof(data) ) {
case "object" : { dataObj = data; break; }
case "string" : { eval ("dataObj = " + data); break; }
default : { throw "unsupported type [" + typeof(data) + "]" }
}
//... more code here
});
Looking at your code it appears that the object return is in the following format.
{"link": "","success": "false"}
To access the object's property values use the following.
data.link and/or data.success (objectName.property)
By the way, the personal/cv.doc is not truly protected. I was able to download it without the password based on what you put here.
Here is how you might use it:
<?php
...
if (strtolower($retrieved_password) === $original_password) {
// Use 'print json_encode(array(...));' if your PHP version is less than 5.4.
print json_encode([
'link' => 'personal/cv.doc',
'success' => 'true',
]);
} else {
// Use 'print json_encode(array(...));' if your PHP version is less than 5.4.
print json_encode([
'link' => '',
'success' => 'false',
]);
}
...
?>
...
$.ajax({
'data': {
'password': $('#password_input').val()
},
'success': function (json_data) {
if (json_data['success'] !== 'false') {
alert(json_data['link']);
}
},
'type': 'POST',
'url': '/path/to/php_script.php'
});
...
This should work properly if json_data is being returned properly in the AJAX call. If it doesn't work, try changing alert(json_data['link']); to console.log(json_data['link']); and check your console. You probably want to this in Chrome or Safari as the developer tools are better on them, in my opinion. You can even try taking a screenshot of the output and add it to your post, so we can see how the data is coming back to you. Hope this helps.