AJAX problems with sending POST, and getting result - javascript

Im new at JS and JSON. So I need to send a JSON massive to Google API using POST, and get the answer and show it via alert. I wrote this page, but this code has no result.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Redericting</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
</head>
<body>
<script type="text/javascript">
$.ajax({
type: "POST",
url: 'https://www.googleapis.com/geolocation/v1/geolocate?key=KEY',
data: '{wifiAccessPoints:["macAddress", "signalStrength"], cellTowers:["cellId", "locationAreaCode", "mobileCountryCode", "mobileNetworkCode"]}',
dataType: "json",
success: function(response) {
alert(response);
}
});
</script>
</body>
</html>

When using AJAX you require to set the content-type of the information you are sending. By default this value is set to application/x-www-form-urlencoded; charset=UTF-8.
$.ajax({
type: "POST",
url: 'https://www.googleapis.com/geolocation/v1/geolocate?key=KEY',
data: JSON.stringify({wifiAccessPoints:["macAddress", "signalStrength"], cellTowers:["cellId", "locationAreaCode", "mobileCountryCode", "mobileNetworkCode"]}),
contentType: "json",
success: function(response) {
alert(response);
}
});

Are you sending the response in JSON format? datatype property refers to the type that you're returning from the server. And if that doesn't match, control will go the error callback. Remove or update the datatype property to match the response type. Make the below changes and try
$.ajax({
type: "POST",
url: 'https://www.googleapis.com/geolocation/v1/geolocate?key=KEY',
data: '{wifiAccessPoints:["macAddress", "signalStrength"], cellTowers:["cellId", "locationAreaCode", "mobileCountryCode", "mobileNetworkCode"]}',
success: function(response) {
alert(response);
},
error: function(jqXHR, textStatus, errorThrown) {
alert("error");
}
});

Related

Posting a JSon object to Webservice via AJAX

I'm trying to send an object in JSon format to my Java backend by AJAX, but I was unsuccessful.
I wonder if the syntax is properly correct.
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="scripts/jquery.min.js.download"></script>
<script src="scripts/jquery.imagemapster.js.download"></script>
<script>
$(document).ready(function(){
$("button").click(function(){
var myJSon = {"name":"Jo","age":30,"city":"Ny"};
$.ajax({
type: "POST",
url: 'http://localhost:8080/Servidor/server',
//contentType: "application/json;charset=utf-8",
dataType: "json",
data: JSON.stringify(myJSon),
success: function (data){
alert('Sucess');
},
error: function () {
alert('Error');
}
});
});
});
</script>
</head>
<body>
<button>Send an HTTP POST request to a page and get the result back</button>
</body>
</html>
When the line contentType: "application/json;charset=utf-8" is not commented out, I get the following error in the backend: INFO: Could not find grammar element for class java.lang.String
Is the syntax correct? Can the error be from the backend itself?
P.S.: Sorry for my bad english
Your code is good, you just misspelled "success" on the AJAX call (you need 2 letter c's instead of 1). So replace sucess: function(data){...} with success: function(data){...} https://jsfiddle.net/stephentillman/aow5pah2/

json_decode php returns null on valid json

I am trying to send a json object through ajax post in javascript as follows:
$.ajax({
type: 'POST',
url: 'testPost.php',
data: {json: cond},
dataType: 'json',
success: function(response) {
alert(response["json"]);
}
});
cond represents the json object which is something like this(converted with JSON.stringify):
[{"field":"name","condition":"<","value":"John"}]
on testPost.php file I have the following:
<?php
$return=$_POST["json"];
$decoded_json=json_decode($return);
$reply["json"]=$decoded_json;
print_r ( json_encode($reply));
?>
My problem is that Json_decode is returning null.
I have checked the encoding(UTF-8), and also checked that the json witch i send to the php file has no slashes or anything.
Can anyone help me?
header('Content-Type: application/json');
You need to add this line in PHP before echo.
Then
$.ajax({
type: 'POST',
url: 'testPost.php',
data: {json: cond},
dataType: 'json',
success: function(response) {
alert(response.field);
alert(response.condition);
alert(response.value);
}
});
Your Ajax data converted to
[{json : {"field":"name","condition":"<","value":"John"}}]
It's not valid because of json : side.
Convert your Jquery to
$.ajax({
type: 'POST',
url: 'testPost.php',
data: {"json": cond},
dataType: 'json',
success: function(response) {
alert(response["json"]);
}
});
And There is works example here,
<?php
if(count($_POST) > 0){
print_r($_POST);
exit;
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="jquery.js"></script>
<script>
$(function(){
var cond = [{"field":"name","condition":"<","value":"John"}];
$.ajax({
type: 'POST',
url: 'a.php',
data: {"json" : cond},
dataType: 'text',
complete: function(response) {
$("body").html(response.responseText);
}
});
})
</script>
</head>
<body>
</body>
</html>
try using stripslashes() then json_decode()
$decoded_json = json_decode(stripslashes($return));

Why doesn't my connection to neo4j work (through Javascript)

I am trying to make a interaction with my local neo4j dataset through javascript. But I get this error:
Uncaught SyntaxError: Unexpected token : (13:20:43:754 | error, javascript)
at http://localhost:7474/?callback=jQuery111107695061936974525_1417522841327&{%22statements%22:[{%22statement%22:%22MATCH%20(n)%20RETURN%20count(n)%22}]}&_=1417522841328:2
success (13:20:43:958)
at public_html/index.html:34
I.e. I want to sent and receive queries with a web application.
This is my code by now:
<head>
<title>TODO supply a title</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script language="javascript" type="text/javascript" src="js/jquery-1.11.1.js"></script>
<script type="text/javascript">
var body = JSON.stringify({
statements: [{
statement: 'MATCH (n) RETURN count(n)'
}]
});
$.ajax({
url: "http://localhost:7474",
type: "POST",
data: body,
dataType: "jsonp",
contentType: "application/jsonp"
})
.done(function(result){
console.log(result);
})
.fail(function(error){
console.log(error.statusText);
}); </script>
</head>
It's not working because you're POSTing to the wrong endpoint. Note your URL
Here are the docs.
It should probably be this:
$.ajax({
url: "http://localhost:7474/db/data/transaction/commit",
type: "POST",
data: body,
dataType: "jsonp",
contentType: "application/jsonp"
})

Jquery Unable to make Ajax Request to Server

I am trying to make an AJAX Request through JQuery
The below is my code .
But when i debugged through Mozilla Firebug i observed that ,there is no Request hitting to the Server .
Could anybody please tell me where i am doing wrong .
<%#page contentType="text/html" pageEncoding="UTF-8"%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>JQuery Example</title>
</head>
<body>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$.ajax({
url: 'ajax/balances',
processData: false,
timeout: 10000,
type: "POST",
contentType: "application/xml",
dataType: "json",
data: '<MyReq user="' + User + '" katha="' + ivalitiKatha + '" />',
success: function(data) {
},
error : function() {
alert("Sorry, The requested property could not be found.");
}
});
});
</script>
</body>
</html>
This is my web.xml on server side
<servlet-mapping>
<servlet-name>Jersey Web Application</servlet-name>
<url-pattern>/ajax/*</url-pattern>
</servlet-mapping>
Maybe adding <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> to the head instead of the body helps!
First of all I would recommend moving the CDN JQuery into the head section of the website.
Secondly I have tested the code above and the issue looks to lie with the (data) you are posting in the JSON / AJAX request.
If you remove it or amend to JSON the request returns a result e.g.
$.ajax({
url: 'test',
processData: false,
timeout: 10000,
type: "POST",
contentType: "application/json",
dataType: "json",
data: '{"foo": "bar"}',
success: function(data) {
alert('Success');
},
error : function() {
alert("Sorry, The requested property could not be found.");
}
});​
You will need to format the data as a JSON request
data: '{"foo": "bar"}',
Hope this helps

Issue with AJAX and jQuery

<html>
<head>
<title>Ajax</title>
<script type="text/JavaScript" src="jquery-1.5.1.min.js"></script>
<script type="text/JavaScript">
function register()
{
$.ajax({
type: "GET",
url: "http://exampleurl.com/api/index.php",
data: "action=login_user&app_key=MyAPIKey&username=Bob&password=HisPassword",
dataType: "text",
success: function(data)
{
alert(data);
}
error: function (jqXHR, textStatus, errorThrown)
{
alert(errorThrown);
}
});
}
</script>
</head>
<body>
<form>
<input type="button" value="Test" onclick="register()"/>
</form>
</body>
</html>
The URL returns a string (plain-text) when used in the address bar. Why is the above code not working? When I click on the button, I get no alert. Basically, nothing happens.
Browsers tried: IE 8 and Chrome.
Thank you for your time.
There's probably an exception being thrown in the $.ajax call.
Consider
ensuring your URI is well formed by taking the query parameters out of the URL and supplying a data object instead:
data: {
action: login_user,
app_key: ....
etc
}
adding an error handler too
Is example.com the URL of your local site? If not, your above example violates Same Origin Policy. You can circumvent this by doing the call through a proxy on the server side.
Try to add
error: function (jqXHR, textStatus, errorThrown) {
alert(errorThrown);
}
http://api.jquery.com/jQuery.ajax/
Have you tried to separate the data ?
$.ajax({
type: "GET",
url: "http://exampleurl.com/api/index.php",
data: "action=login_user&app_key=MyAPIKey&username=Bob&password=BobPassword",
dataType: "text",
success: function(data) {
alert(data);
}
});
Do you have access over the backend url?
You might need to declare the contentType. You might also need to do a post and set the data.
data: "{ 'action': 'login_user', 'app_key': 'MyAppKey', etc. }"

Categories