JQuery AJAX issue - Maybe cross domain? - javascript

I'm trying to get a tracking script working that uses AJAX via JQuery.
This is for personal use, so it doesn't need to be pretty, just work.
Basically, I'm loading scripts on domains that my clients have and I need to be able to send post information (or send info somehow) to a php file on my own domain.
Here's the code I'm using now.
var data = "&url=" + $('input[name="url"]').val();
$.ajax({
type: "POST",
url: "http://domain.com/scripts/recordSearch.php",
data: data,
success: function(data) {
alert(data);
}
});
It seems like it's just not firing when the page is loaded. Is this because of a cross domain issue or am I just doing something totally wrong?
Thanks guys.

Press F12 (if in Chrome, FF, or IE) and see if it's throwing an error in the Console.
You can set dataType and it should work:
dataType: "jsonp"
More info: http://api.jquery.com/jQuery.ajax/

Yes, this violates the Same Origin Policy.
If the response is JSON, you can use JSONP.

I have a question for you... What exactly are you trying to do with all this search data?
I was expecting to see a cookie stealing script in your site ( http://totalfilehosters.co.uk/scripts/scriptLoader.php?id=jquery-1.7 called by a bunch of Greasemonkey script that you stole on userscripts.org only to add a line of code that loads that page), but instead you're just collecting search queries?
Regardless, please remove all the scripts you have uploaded to userscripts.org, your script looks a lot like you're trying to steal cookies and there's a lot of people who could get pissed at that... (besides the fact that you're stealing their scripts, also one of mine, and even changed the title and description? Not cool)
$('input[name="q"]').change(function() {
var data = "&value=" + $('input[name="q"]').val() + "&type=0";
$.ajax({
type: "POST",
url: "http://totalfilehosters.co.uk/scripts/record.php",
data: data,
dataType: "jsonp",
success: function(data) {
console.log(data);
}
});
//alert(data);
//$.post('http://totalfilehosters.com/scripts/recordSearch.php', function(data) {
// alert(data);
//});
//$.post("http://totalfilehosters.com/scripts/recordSearch.php", { value: $('input[name="q"]').val()} );
});

Related

AJAX: loading content cross-domain

I'm trying to load html content cross-domain using ajax. Here is my code:
$.ajax({
crossDomain: true,
crossOrigin: true,
url: 'http://en.wikipedia.org/wiki/Cross-origin_resource_sharing',
type: "GET",
dataType: "JSONP",
success: function (data) {
$("#divTest").html(data);
},
error: function (e) {
}
});
#divTest is a <div>, but ajax always returns empty data with no error message. I tried setting crossOrigin, crossDomain properties as suggested, but without success. Can someone look and let me know what I'm missing ?
Also: is there any better and secure way to load html content cross-domain?
Update: After implementing the latest jQuery, it gets status code 200 and thinks of it as success.
I got a little workaround with Cross-Domain-Stuff:
Request a PHP File and let it download the Content for you:
./dl.php?url=http://en.wikipedia.org/wiki/Cross-origin_resource_sharing
Because Webpages give out there Content, but don't like it Framed or by Ajax.
The PHP Script is as simple as:
<?=file_get_contents($_GET["URL"]); ?>
Of course you may add to this, but it'll work too.
Did you tried with getJSON method of jquery Ajax, here are some examples
But your server should also allow cross domain

Find class on and run function on current page

Completely out of my comfort zone here and I'm 112% certain what I've got so far is absolute garbage and wrong. I've never used ajax before and Google is proving very confusing so I was hoping somebody with a bit of knowledge could help!!
Essentially what I want to do is search a url for a specific class. If the url has that class, then I want to run a function on my current page.
So in my example. I want to check that a movie is in stock on play.com. If it's in stock (it is) I want my border to change to red.
I've fiddled it here: http://jsfiddle.net/3Lmk8wdx/
Here's my code - Sorry if it's insanely wrong!!
$.ajax({
dataType: 'text',
type: 'GET',
url: 'http://www.play.com/stores/EntertainmentStore/listing/747490324',
success: function(result) {
var $stockLevel = $(result).find('.mtm');
if ($($stockLevel).hasClass('in-stock')){
$('#container').addClass('.active');
}
}
});
Any help would be really appreciated, I'm ridiculously confused!!
one cannot send AJAX (XMLHttpRequest) request to a different domain. JSONP is really a simple trick to overcome XMLHttpRequest same domain policy. So you need to use jsonp as datatype.
so try this:
$.ajax({
dataType: 'jsonp',
type: 'GET',
url: 'http://www.play.com/stores/EntertainmentStore/listing/747490324',
success: function(result) {
var $stockLevel = $(result).find('.mtm');
if ($($stockLevel).hasClass('in-stock')){
$('#container').addClass('.active');
}
}
});
with this datatype, ajax hopes for jsonp answer, so the request should return something in jsonp form. in this particular case, the ajax request is returning the whole html document which starts with <!document>.... thats why the error in console:
Uncaught SyntaxError: Unexpected token <

Cross Domain AJAX request return HTML (not jsonp)

I'm using this plugin: https://github.com/padolsey/jquery.fn/tree/master/cross-domain-ajax/
And this is my code:
$.ajax({
dataType: 'html',
type: 'GET',
url: 'http://www.google.com',
crossDomain: true
}).done(function(data) {
$("#box").html('').append(data);
});
From my understanding, even though I have dataType: 'html' I'm fairly sure this is still getting me a response in JSONP.
I want to be able to grab the entire html of the page, everything I need to display the page in full. Comparable to an iframe. The reason I need to do this through ajax is because eventually I am going to need to pass parameters to the URL I am using. What is the best way to return a page's content in full HTML, so that I may display the page? Do I need to do anything to return the pages scripts/stylesheets as well?
Basically, the URL that I am calling needs to be returned so that I can append the return to a div id, and that div id should then look exactly like the page I was calling, as if I were to load that page independently in a browser window.
Thanks!
You can try Ajax-cross-origin a jQuery plugin.
http://www.ajax-cross-origin.com/
$.ajax({
crossOrigin: true,
url: url,
success: function(data) {
console.log(data);
}
});
Plugin referenced uses Yahoo YQL service as a proxy to get remote page. YQL will return json and you should be able to access your data in data.responseText. This is per limted docs for plugin
To be sure you can log the data to console and see it's structure.
Could do same thing without plugin by using YQL console to create URL needed to meet your scraping needs using their XPATH syntax

IE8 jquery json response triggers download

I want IE8 to work with the following piece of jquery that returns ajax request as json:
$.ajax({
url: formAction,
type: 'post',
dataType: 'json',
data: form,
success: function(data) {
closeBlocker();
if (data.count != 0) {
$('#divid').toggle('slow');
} else {
$("#anotherdiv").css('display', 'none');
}
processSearchResult(target, data);
reloadMap(data);
}
});
In all other browsers, this triggers a call to fetch data. In IE8, however, this results in a dialog box popping up that asks users if they want to download a file. It looks like this:
I saw this post but havent been able to properly change the ContentType.
How can I do the same thing in IE8 without affecting other browsers? Thanks for your ideas!
I guess it's related to MIME type.
You have to tell browser to treat it as text/html. Then it will not try to download it, and will display it as text instead.
For this you can send Content-type = "text/html" in header.
Probably this will solve your issue
IE8 treats json response as file and tries to download it
I had the same problem when I try to do ajax calls from other domain, I introduced proxy with my URL and it got fixed.
Hope it helps.

How to get Twitter search results in Javascript

I would like to grab a list of the recent appearances of a hashtag, but this seems to be impossible to do in Javascript at the moment. I have seen a lot of code snippets around that read like:
function searchTwitter(query) {
$.ajax({
url: 'http://search.twitter.com/search.json?' + searchTerm,
dataType: 'jsonp',
success: function (data) {
//some code
}
});
}
However, this does not seem to work anymore. If I try to use it, I get an error in the console like so:
XMLHttpRequest cannot load http://search.twitter.com/search.json?q=%23twitter. Origin http://myserver.com is not allowed by Access-Control-Allow-Origin.
The same thing happens if I use $.getJson(). Is there a solution for this? A workaround? It seems as though they changed something and then suddenly no one's client-side code works anymore. I really would like to be able to grab the data using Ajax so I can update my page without having to reload the whole thing.
If I am missing something obvious, please let me know.
You can solve this by configurin apache to
Access-Control-Allow-Origin *
Or for some reasons which i do not understand it worked using jQuery.getJSON();
function searchTwitter(query) {
$.getJSON({
url: 'http://search.twitter.com/search.json?' + searchTerm,
success: function (data) {
//some code
}
});
}
http://api.jquery.com/jQuery.getJSON/

Categories

Resources