ajax json adding trailing colon - javascript

var mydata = {
"one": {
"brand": "acer",
"cost": "212132"
}
}
$.ajax({
url: 'http://localhost',
type: 'post',
dataType: 'json',
data: JSON.stringify(mydata)
});
Above code is adding a colon to the data when i view the form send data in chrome dev tools. Is there anything wrong with the request?

You are viewing application/x-www-form-urlencoded parsed data. So Chrome is trying to establish key value pairs. Click "view source" near the "Form Data" heading in the network tab view. You will see your JSON without the colon.

Was the same for me. I did not see the colon when viewing source. BUT it did not work.
My solution was to add the missing contentType
$.ajax({
url: `url`,
contentType: "application/json",
type: "POST",
data: JSON.stringify(data)
});

Related

Updating Github Issue Body with Ajax

I've been successfully able to pull an issue, but not update it. My goal is to update the body of the issue with a new string. Per the documentation here I understand I need to do a "PATCH". This is what I have so far:
var patchedIssue = $.ajax({
dataType: "json",
type: 'PATCH',
body: newBodyText,
url: issueURL,
success: function(data){
console.log("success");
}
});
But when I do that in the network tab I see a Status code of 422: Unprocessable Entity. Response message from the API is "Invalid request.For 'links/1/schema', nil is not an object."
If I remove the "body" line I get the same error
Any thoughts? To get the body text I literally did the same as above but with "GET" instead of patch, and then the body text was "patchedIssue.responseJSON.body"
Figured it out, needed a "data" key.
This successfully replaced the body text:
patchedIssue = $.ajax({
dataType: "json",
type: 'PATCH',
url: issueURL,
data: '{"body":"test"}',
success: function(data){
console.log("success?");
}
});

From curl to jQuery’s $.ajax() Function

I'm trying to convert the curl code from an API called TextRazor to jquery's AJAX because of a platform limitations. I have tried many solutions from similar questions by the community but can't seem to get any data back (through the alert dialog). If it matters
from the documentation calling the API looks like this:
curl -X POST \
-H "x-textrazor-key: YOUR_API_KEY" \
-d "extractors=entities,entailments" \
-d "text=Spain's stricken Bankia expects to sell off..." \
https://api.textrazor.com/
My current AJAX code looks like this:
$.ajax({
url: "https://api.textrazor.com/",
type: "POST",
dataType: 'json',
data: {
x-textrazor-key: "YOUR_API_KEY",
extractors: "entities,entailments",
text:"Spain's stricken Bankia expects to sell..."
},
success:function(data) {
alert(JSON.stringify(data));
},error: function(xhr) {
alert("<some error>");
console.error(xhr.responseText);
}});
here is the link to jsfiddle if it helps: jsfiddle.net
Thanks for your support!
I think you have to pass "x-textrazor-key: YOUR_API_KEY" as additional header
$.ajax({
url: "https://api.textrazor.com/",
type: "POST",
dataType: 'json',
beforeSend: function(xhr){xhr.setRequestHeader('x-textrazor-key', 'YOUR_API_KEY');},
data: {
extractors: "entities,entailments",
text:"Spain's stricken Bankia expects to sell..."
},
success:function(data) {
alert(JSON.stringify(data));
},error: function(xhr) {
alert("<some error>");
console.error(xhr.responseText);
}});
data: {
x-textrazor-key: "YOUR_API_KEY",
The data: bracket in jQuery means that you want to send that data as POST, while you need to send the API key as a header.
Add this field to your code (after URL or so):
headers: {"x-textrazor-key": "YOUR_API_KEY"}
This looks close to me, but you put the header into the POST body. I think it should be the below. (Note that you also need quotes around 'x-textrazor-key', since the dashes in it will otherwise be interpreted as subtraction.)
$.ajax({
url: "https://api.textrazor.com/",
type: "POST",
dataType: 'json',
headers: {
'x-textrazor-key': "YOUR_API_KEY"
},
data: {
extractors: "entities,entailments",
text: "Spain's stricken Bankia expects to sell..."
},
success: function (data) {
alert(JSON.stringify(data));
},
error: function (xhr) {
alert("<some error>");
console.error(xhr.responseText);
}
});
There could of course be other issues here. (E.g. perhaps the API doesn't support cross-origin requests.) You'll want to take a look at the network tab in your browser's developer tools to see what actually happens.

Configure / Change JQuery AJAX Encoding

I am making a basic PATCH call like this one:
.ajax({
url: "/foo/bar/"
type: "PATCH",
dataType: 'json',
data: {
"foo": "foosball",
"bar": "bars on bars"
},
...
});
Jquery automatically encodes the data, which leaves "bars on bars" like "bars+on+bars". Is there a way to change the encoding so that spaces are replaces with %20 rather than pluses?
I've noticed this thread that didn't seem to lead anywhere.
I've also taken note of encodeURI and encodeURIComponent but haven't gotten either to work. Both seem to result in the string being double encoded, leaving me with bars%2520on%2520bars
summary:
What I start with:
... "bars on bars" ...
What the received data looks like after jquery encodes the request:
"bars+on+bars"
What I need the received data to look like:
"bars%20on%20bars"
How about use a variable and pass that to data.
var d={
"foo": "foosball",
"bar": "bars on bars"
}
d.bar=encodeURI(d.bar);
.ajax({
url: "/foo/bar/"
type: "PATCH",
dataType: 'json',
data: d,
...
});
Still wish there was a better way, but I ended up using this plugin from this website.
jQuery.extend({
postJSON: function(url, data, callback) {
return jQuery.ajax({
type: "POST",
url: url,
data: JSON.stringify(data),
success: callback,
dataType: "json",
contentType: "application/json",
processData: false
});
}
});
This forces my api to parse the body as a string into a dict/json. Hopefully in a few years someone can come along with a better solution.

Jquery .ajax get request with Odata

I am facing the following problem, I am trying to build a small application to search within the Odata dataset from the KVK (dutch chamber of commerce) to retrieve data based on file numbers, ZIP codes or tradenames.
My ajax code looks like this:
$.ajax({
url: urls,
error: function(){console.log('FAILED!')},
headers:
{
"Content-Type":"application/json",
"ovio-api-key":"XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX"
},
dataType: 'jsonp',
complete: function(data) {
console.log(data);
}
});
the URL would like like this:
https://overheid.io/api/kvk?&filters[postcode]=3553BA&callback=jQuery110208921047365292907_1432134770039&_=1432134770040
The error I am getting:
The part I do not understand, when I try the exact same URL in a web rest client such as chrome's advanced rest client the result is exactly what I want:
Fixed this by changing the code to:
$.ajax({
type: 'GET',
url: urls,
error: function(){console.log('Gefaald!')},
headers:
{
"Content-Type":"application/json",
"ovio-api-key":"XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX"
},
dataType: 'json',
complete: function(data) {
console.log(data);
}
});
just had to add the 'GET' type.

Displaying accented character in Javascript

I am having problem displaying accented character in my app; It is showing ⛽ instead of ó. The string is coming from a json file retrieved from a server. Here are the technical details:
JSON: (This is the object being retrieved from the server)
notice the 3rd key "Relación" the letter "o" is accented.
[
{
"key": "Canales"
},
{
"key": "Productos"
},
{
"key": "Relación con el ejecutivo"
}
]
Ajax (here is the code to retrieve the information)
notice I already added charset=utf-8 as most answers suggest
$.ajax({
url: url,
type: "GET",
dataType: "json",
contentType: "application/json; charset=utf-8",
success: function(uri){
alert("clintg test: " + JSON.stringify(uri));
}
}
Alert: (as you can see, it is just showing a box symbol where it's supposed to be -> ó)
To give more detail to #georg 's advice that helped me solve this issue:
Since I can't change the server side scripts, I adjusted the code on my side.
I changed the charset in my ajax request to ISO-8859-1, but since the default charset of ajax is utf-8, I had to override the charset with $.ajax.beforeSend:
$.ajax({
url: url,
type: "GET",
dataType: "json",
contentType: "application/json; charset=iso-8859-1",
success: function(uri){
alert("clintg test: " + JSON.stringify(uri));
},
beforeSend: function(jqXHR) {
jqXHR.overrideMimeType('application/json;charset=iso-8859-1');
}
}
Here's a link to the question that helped me figure out and override the charset: Jquery ignores encoding ISO-8859-1

Categories

Resources