0

The following ajax-getJSON (.htm) sample actually will run on Internet Explorer from the website that I found the sample on, but when I copied the sample code and tried running the sample locally on my workstation (win10) it only works on Microsoft Edge. On IE and Chrome I get this error message --

Message from webpage Error: Access denied

All the subfolders have full control for admin/local user ... Is there a workaround for this error so I can run it on IE and/or Chrome? Does anything need to be refactored so that I can run this as a .htm (.html) file?

<html>
<head>
    <title>Test Json thing</title>
        <style>
        body
        {
        background-color:#FAF9CF;
        }
    </style>
    <script src="jquery.min.js"></script>

    <script type="text/javascript">
        $(document).ready(function (){
            $("#btn382").click(function(){        
                /* set no cache */
                $.ajaxSetup({ cache: false });

                $.getJSON("car-saleX.json", function(data){ 
                    var html = [];

                    /* loop through array */
                    $.each(data, function(index, d){            
                        html.push("Manufacturer : ", d.Manufacturer, ", ",
                                  "Sold : ", d.Sold, ", ", 
                                  "Month : ", d.Month, "<br>");
                    });


                $("#div381").html(html.join('')).css("background-color", "orange");
                }).error(function(jqXHR, textStatus, errorThrown){ /* assign handler */
                alert("error occurred! " + jqXHR + " *" + textStatus + "* " + errorThrown);
            });
        });
    });
    </script>
    </head> 

    <body>
        <form name="form1" method="post" id="form1">
            <div id="example-section38">    
                <div>Car sale report</div>
                <div id="div381"></div>
                <button id="btn382" type="button">Click to load car sale report (json type)</button>    
                &nbsp;<a href="car-saleX.json" target="_blank">Original car sale report</a>
            </div>
        </form>     
    </body>
</html>

Here is the sample .json data file (car-saleX.json)

[{
    "Manufacturer": "Toyota",
    "Sold": 1200,
    "Month": "2012-11"
}, {
    "Manufacturer": "Ford",
    "Sold": 1100,
    "Month": "2012-11"
}, {
    "Manufacturer": "BMW",
    "Sold": 900,
    "Month": "2012-11"
}, {
    "Manufacturer": "Benz",
    "Sold": 600,
    "Month": "2012-11"
}, {
    "Manufacturer": "GMC",
    "Sold": 500,
    "Month": "2012-11"
}, {
    "Manufacturer": "HUMMER",
    "Sold": 120,
    "Month": "2012-11"
}]
Rich P
  • 202
  • 3
  • 12
  • Are you just opening the HTML file directly from your computer? If I recall, chrome won't let the html page make ajax calls to get files from your computer for security reasons. See https://stackoverflow.com/questions/4819060/allow-google-chrome-to-use-xmlhttprequest-to-load-a-url-from-a-local-file – Chris Phillips Oct 10 '17 at 19:08

1 Answers1

0

You should run your code on localhost server. So you need to have installed at least Apache and PHP. Then simply from console you can run command php -S localhost:8000

Sabre
  • 46
  • 3