dynamic loading of html via php javascript not executing

Question

i have a simple setup, with php pulling html content from a database. if i go to my template page, it loads the data and returns it to the browser via a simple php echo ... not rocket science.

now, i've written an html file using jquery and an ajax call. i load the html file in my browser and the javascript / ajax query works.

when i load the html into the database and print it out via the php / echo, the content is the exact same when i view the source, but the ajax query doesn't execute.

<html>
<head>
  <title>random query - api - get</title>
  <script src="http://code.jquery.com/jquery-1.5.min.js"></script>
</head>
<body>
<pre>
executing the GET method
<script language="javascript" type="text/javascript">

$.ajax({
   type: "GET",
   url: "http://some-rand.om.api.com",
   data: "011b38b8-011f-4b03-bb21-4c5bb26600b3",
   success: function(msg){
     alert( msg );
   }
 });

</script>
</pre>
</body>
</html>

Any comments / suggestions would be great. What I find bizarre, is i have no problem copying the source of http://jquery.com/ and pasting it into the db and doing the php / echo. this works fine. maybe an onLoad() would help...hm.

i think it might be the data from ur ajax, it needs to be {'query':'blablabla'} or 'query=blabla' — Val, Feb 13 '11 at 18:20
I do not understand the question. What is not executed at which point? — Pekka, Feb 13 '11 at 18:21
Pekka, "the ajax query doesn't execute" . Sorry, thought it was clear. — sdolgy, Feb 13 '11 at 18:29

score 1 · Answer 1 · edited May 23 '17 at 11:55

1

The issue is outlined in the following url:

XmlHttpRequest error: Origin null is not allowed by Access-Control-Allow-Origin

When I load the javascript console in chrome I get this:

XMLHttpRequest cannot load http://some-rand.om.api.com/user?011b38b8-011f-4b03-bb21-4c5bb26600b3. Origin http://localhost is not allowed by Access-Control-Allow-Origin.

edited May 23 '17 at 11:55

Community

1
1

answered Feb 13 '11 at 18:28

sdolgy

6,963
3
41
61

Seems to me he was just putting a random URL as to hide the actual URL he is attempting to access. sdolgy, is the URL you are accessing on the same server as this ajax call? – Jeremy Battle Feb 13 '11 at 18:39
"same server". i have two vhosts configured on the same server. some-rand.om.api.com and some-rand.om.client.com ... the code is loaded in the client vhost and the api vhost is where the target javascript is pointing at. – sdolgy Feb 13 '11 at 18:41
What the heck? Are you answering your own question? Is that an answer or another question? Make sure everything is the same origin. some-rand.om.client.com and some-rand.om.api.com are not the same orgin. – mwilcox Feb 13 '11 at 20:48

sdolgy · Accepted Answer · 2011-02-13T19:00:30.410

To resolve the problem, on the api vhost, in the code that serves the content accessed by the ajax query, i added this (it is also php):

header('Access-Control-Allow-Origin: http://some-rand.om.client.com');

Now when I access it, it's all good and loads as expected. So, infact, it wasn't related to it being stored in the database, php or javascript. It was related to cross site scripting.

Or, to be super lazy (probably not a great idea...):

header('Access-Control-Allow-Origin: ' . $_SERVER["HTTP_ORIGIN"]);

score 0 · Answer 3 · edited Jul 31 '12 at 16:25

0

If in your description of the problem you are listing the whole of the code, then the JavaScript should be wrapped in a $(document).ready(function(){ ... });.

i.e.

$(document).ready(function(){

    $.ajax({
          type: "GET",
           url: "http://some-rand.om.api.com",
          data: "011b38b8-011f-4b03-bb21-4c5bb26600b3",
       success: function(msg){alert( msg );}
   });

});

edited Jul 31 '12 at 16:25

user229044

232,980
40
330
338

answered Feb 13 '11 at 18:57

Neil

3,229
1
17
15

dynamic loading of html via php javascript not executing

3 Answers3