making ajax work on JSBIN - javascript

I'm trying to get ajax to work in JSBIN like demonstrated in this video. What have I don't wrong. Seems like it ought to work!
$(document).ready(function(){
$.ajax({
type: "get",
url: "http://jsbin.com/ipefom/1/js",
dataType: "json",
success: function(returnedData){
console.log(returnedData)
}
});
});
http://jsbin.com/ocerag/3/edit
I don't understand where my parseerror comes from.

Your json is invalid:-
There is as edit:8 in json which is misplaced and also you have duplicate keys while the number is repeated again. Seems like the same set was copy pasted again.
"968":"a","969":"a","970":"a","971":"a","972":"a","973":"a","974":"a","975":"a","976":"a","977":"a","978":"a","979":"a","980":"a","981":"a","982":"a","983":"a","984":"a","985":"a","986":"a","987":"a","988":"a","989":"a","990":"a","991":"a","992":"a","993":"a","994":"a","995":"a","996":"a","997":"a","998":"a","999":"a"} edit:8
{"0":"a","1":"a","2":"a","3":"a","4":"a","5":"a","6":"a","7":"a","8":"a","9":"a","10":"a","11":"a","12":"a","13":"a","14":"a","15":"a","16":"a","17":"a","18":"a","19":"a","20":"a","21":"a","2

Because it is not returning valid json, when you try
dataType: "html", in place of dataType: "json", then it will show that the returning is not a valid json.

Related

Ajax not working with a specific file name

Something really weird happened today and I cannot understand its behavior so if someone can help me to understand I would really appreciate it,
So I tried to do ajax call like below
var dto = {
'entity': 'SOME_VAL'
};
$.ajax({
type: 'GET',
url: '/WebService/checkout/applyCoupon.php',
dataType: "json",
data: dto,
contentType: "application/json; charset=utf-8",
cache: false,
success: function (response) {
console.log('Success!');
},
error: function() {
console.log('Error!');
}
});
and it returned my website's HTML code instead of JSON return values.
After a while I was able to resolve the issue by using the same code with diffrent file names.
url: '/WebService/checkout/applyCoupon.php', //NOT WORKING
url: '/WebService/checkout/applyCoupon2.php', //NOT WORKING
url: '/WebService/checkout/coupon.php', //NOT WORKING
url: '/WebService/checkout/apply.php', //WORKING
url: '/WebService/checkout/ap.php', //WORKING
It seems like it does not work when the file name contains coupon in it.
I have other websites running just fine using the exact same code with the file name applyCoupon.php so I do not understand why it won't work on a specific website. I can just simply use a different file name but I want to understand how/why it could happen. The environment is IIS. Can someone please help me to understand this issue? Thank you!

Getting POST API to work with ajax using JavaScript

I'm trying to reach an API from inside my tag manager. The language to use for the so-called building blocks in this tag-manager is JavaScript. The POST API I am trying to use is fully functioning and works like this:
input:
{"features": "xyz"}
output:
[0.45]
I set up an ajax statement, but it does not seem to work.
I have tried all different kinds of input and content types. The code looks like this:
$.ajax({
url: apiurl,
type: "POST",
data: {"features": "xyz"},
contentType: "application/json; charset=utf-8",
success: function (data) {
console.log(data)
},
error: function(){
console.log("Error"); }
});
What I am doing wrong here? I keep getting error messages.

Accessing PHP variable as URL in JQuery Ajax request

I am experiencing some problems with having the Ajax request function/method in JQuery recognizing a PHP-variable from outside the script code. What I am trying to do is using the variable $live_update_url as the url-argument in the Ajax code. The code below is not working, but if I hard code the value of the url there are no problems. So it should be the variable itself that is not accessed. What am I doing wrong here?
function ajaxd() {
$.ajax({
url: <?php print($live_update_url);?>,
type: "get",
data: {live_time: 'value'},
dataType: "json",
success: function(data){
$('#local_time').html(data.live_time);
}
});
It looks like you are missing the quotes around the URL value in your JSON.
Make sure that the value returned by the $live_update_url includes quotes or try this:
function ajaxd() {
$.ajax({
url: "<?php print($live_update_url);?>",
type: "get",
data: {live_time: 'value'},
dataType: "json",
success: function(data){
$('#local_time').html(data.live_time);
}
});
Found a solution:
Used the following definition of $live_update_url in the PHP code:
$live_update_url = "'http://localhost/projectName/api/time.php?g_id=".$g_id."'";
This string already includes single quotes within the double quotes. Then I used the echo <<<_END-construct and just added the following line in the Ajax request:
url: $live_update_url

Getting JSON in nested ajax calls

The http request sent to some 'request_url' returns json response in format {'succes': 1, 'html': 'thestuff'}
so when
jQuery.ajax({
url: 'request_url',
success: function(response){
alert(response.html); //'thestuff' is here as expected
}
});
'thestuff' can be found in response.html as expected. But if this ajax is called inside the 'success' callback of another one ajax request then the response.html is coming empty and 'thestuff' is going to 'response'.
jQuery.ajax({
url: 'some_other_url',
success: function(some_other_response){
jQuery.ajax({
url: 'request_url',
success: function(respose){
alert(response.html); //there is nothing
alert(response); //I see 'thestuff' which is expected in 'html'
}
})
}
});
Why does it happen?
Update: 'thestuff' contains some js code with {} I can suppose something can get confused but why it works well with single (not nested) ajax request.
Not enough reputation to comment so adding as an answer
Here is expanding on charlietfl comment of using dataType.
I made it work using dataType="json". Json has to be strictly formatted though as per jQuery documentation.
jQuery.ajax({
url: 'some_other_url',
success: function(some_other_response){
jQuery.ajax({
url: 'request_url',
dataType:"json",
success: function(response){
alert(response.status); //there is nothing
alert(response); //I see 'thestuff' which is expected in 'html'
}
})
}
});
request_url should return something like this (note, quotes should be used instead of apostrophes)
{"status":"s","html":"some stuff"}

JSONP via getJson not working?

I have getJson like this:
$.getJSON(userUrl+'scanp?callback=?', { 'someparametar': 100 }, function(data){
console.log(data);
});
and I do get a response from my url, and it looks like this:
'"jQuery1110010384737118147314_1401820556204({'hasWon':'false','code':'120580e9fce67a4921f31af7ffa358cc10c83b10','defaultReward':'{\"secure_url\":\"https://res.cloudinary.com/deh0vdgzd/image/upload/v1401318096/k6jrm2pehwycmehrkicz.png\",\"url\":\"http://res.cloudinary.com/deh0vdgzd/image/upload/v1401318096/k6jrm2pehwycmehrkicz.png\",\"resource_type\":\"image\",\"format\":\"png\",\"height\":960,\"width\":640,\"signature\":\"a8ca9bb867e0a3d99e1666b7891e8f918d81e627\",\"version\":1401318096,\"public_id\":\"k6jrm2pehwycmehrkicz\"}''}"'
Any idea why I don't get any response when I console.log it?
With 'callback' in your querystring, JQuery wraps the response with a randomly generated method name. To get JSON (without method name), remove 'callback=?' from querystring.
If your server supports JSONP, you can make a call like this :
$.ajax({
type: 'GET',
url: url,
jsonpCallback: 'jsonCallback',
contentType: "application/json",
dataType: 'jsonp',
success: function(json) {
console.log(JSON.stringify(json));
},
error: function(e) {
console.log(e.message);
}
});
Hope this helps.
Well I figured it out, the request I wrote was perfectly fine. The thing that was causing the the problem was response I was getting from server.
It was JSON stringified before return.

Categories