Can't load content inside a div

Question

I am trying to load some content inside a div #display. I have read many questions regarding this matter here, but still I have been unable to get it working. The alert function which I have just added for testing purpose works without any problem.

Here is what I have tried

$(document).ready(function(){
    $('#townships').click(function() {
        $('#display').load("helloworld.html");
            alert("Hi");
        });
    });

I am trying this offline. The helloworld.html file is in the same folder with the homepage file.

Do you want me to add the html code of helloworld.html here? — Behroz, Jul 17 '14 at 10:53

score 3 · Accepted Answer · answered Jul 17 '14 at 10:52

3

I am trying this offline

I believe this is your problem. AJAX requests to the local filesystem will be blocked by the browsers' security settings.

You need to run it under a webserver, either on your local machine, such as WAMP/LAMP/IIS or on a remote machine.

answered Jul 17 '14 at 10:52

Rory McCrossan

331,213
40
305
339

I set up a WAMP server, as you suggested, and now it works flawlessly. – Behroz Jul 18 '14 at 11:11

score 0 · Answer 2 · edited May 23 '17 at 10:26

0

You can not do AJAX request without loading files from some server. Doing it by loading files from file system won't work because of SAME ORIGIN policy. Since there is no domain to compare to the AJAX requests fail. You can see the exception while doing it in Chrome.

This is relevant

AJAX code do not run locally

edited May 23 '17 at 10:26

Community

1
1

answered Jul 17 '14 at 10:56

amitamb

1,067
11
22

score 0 · Answer 3 · answered Jul 17 '14 at 14:36

0

You should put your html file in a web server. If you have python installed, you can just type

python -m SimpleHTTPServer [port]``

In order to have a rapid web server in your working directory.

answered Jul 17 '14 at 14:36

Zan RAKOTO

903
9
14

Can't load content inside a div

3 Answers3