Javascript working in Safari but not Chrome or Firefox

Question

I am not a programmer at all, so I am sorry in advance, but after searching the web I cannot find an answer.

I am trying to take the inventory search from this website and put it in a Facebook tab. I grabbed the code from the website and edited out the headers and footers, which I did not want, in TextEdit. I am only trying to take the inventory search portion.

When I tested it out in Safari it seemed to work. The inventory search came up and all of the buttons and filters worked perfectly and when I would go to a different page the headers and footers were still gone and just the inventory search was there - perfect.

However when tested in Chrome and Firefox the buttons and filters did not work at all, and you cannot go past the first page or apply filters.

So I decided to go to the site (the first page of the inventory search like the link above) and save the source code to my desktop to see if when I opened this in Chrome or Firefox if it would work, and it didn't, no buttons or filters worked, stuck on first page. But it did work in Safari.

What does this mean? Should I give up now? I would include the code but it is the longest I have ever seen. All of the testing of the code I did through TextEdit.

edit:
Here are the errors in Chrome:

Uncaught SyntaxError: Unexpected token < Chevy.html:4608 XMLHttpRequest cannot load http:‍//www.erikschevrolet.com/searchVehicles.ajax. Origin null is not allowed by Access-Control-Allow-Origin.
Uncaught Error: XmlRenderEngine = >Unknown error bundle.js:1 XMLHttpRequest cannot load http:‍//www.erikschevrolet.com/searchVehicles.ajax. Origin null is not allowed by Access-Control-Allow-Origin.
Uncaught Error: XmlRenderEngine = >Unknown error bundle.js:1 XMLHttpRequest cannot load http:‍//www.erikschevrolet.com/searchVehicles.ajax. Origin null is not allowed by Access-Control-Allow-Origin.
Uncaught Error: XmlRenderEngine = >Unknown error bundle.js:1

Answer 1

These Chrome warnings are not relevant here. Errors given above are about cross-origin issues. Due to really evil things in which accessing remote resources from within Javascript can result, modern browsers block them unless explicitely allowed.

For example, most content from http://example.com can't be accessed by javascript under http://example.net domain. Since you downloaded most files and you are trying to run them locally, but still some of them refer to files under the http://www.erikschevrolet.com domain, it's not allowed.

AFAIK there isn't a really simple way to avoid this issue; the safest solution would make you download all the used files and manually change references to http://www.erikschevrolet.com with references to your local path. Alternatively, one can set the withCredentials value of XMLHttpRequest to true (but since you're not a programmer, you can really mess it up...) like this (example from http://hacks.mozilla.org/2009/07/cross-site-xmlhttprequest-with-cors/):

var request = new XMLHttpRequest();
var url = 'http://bar.other/resources/credentialed-content/';
function callOtherDomain(){
  if(request)
  {
   request.open('GET', url, true);
   request.withCredentials = "true";
   request.onreadystatechange = handler;
   request.send();
  }
}

And even this might not get the expected result as a lot of these files are probably generated dynamically on server and are subject to change.