-2

I know this question was asked many times, but after reading the answers, and trying some solutions, my code still doesn't work. Here are my working files :

my_app
   -index.html
   -task1
       -index.html

In my_app/index.html, I declare an array , that I have to send to task1/index.html

testArray =[1, 2, 3];

    var myUrl= "task1/index.html";
          $.ajax({
                type: "POST",
                url: myUrl,
                dataType: "json",
                data: JSON.stringify({images:testArray}),
                success: function (data) {
                console.log('success');
                    alert(data);
                }
            });
             window.open(myUrl); 
//this code is called when a radio button is checked

The new window which points to the right url opens, but the testArray isn't sent. I got 2 errors: 

1/ Origin null is not allowed by Access-Control-Allow-Origin.
2/the variable images is not defined when I try to access it from task1/index.html

For the 1st error, I read that this may be caused by Google Chrome's restriction when it comes to use Ajax with local resources. As suggested here Origin null is not allowed by Access-Control-Allow-Origin, I added 

--allow-file-access-from-files

in Google Chrome properties. But the path was not accepted (I had a pop-up window "path not correct").

What is weird is that I tried to run the code with FireFox, I still have error 2

Is anything missing in my Post Ajax request? Is it possible to use Ajax to send data between 2 html files ?(I don't have any client/server side app here)

Thanks!

Community
  • 1
  • 1
user1499220
  • 419
  • 4
  • 12
  • 23

1 Answers1

0

If you need to send the data to a new window that you are going to open in that moment, use GET instead and pass the parameters on the url.

But, you could create an empty window first, then do your ajax and use the return content to fill your new window.

Here is an example fiddle opening the window and filling it with the result of a POST call: http://jsfiddle.net/bxhgr/

var mywindow = window.open();
testArray = [1, 2, 3];

var myUrl = "/echo/json/";
$.ajax({
    type: "POST",
    url: myUrl,
    dataType: "json",
    data: {
        json: JSON.stringify({
            images: testArray
        })
    },
    success: function (data) {
        console.log('success');
        //alert(data);
        mywindow.document.body.innerHTML = '<pre>' + data.images + '</pre>';
    }
});
chris-l
  • 2,802
  • 1
  • 18
  • 18
  • I tried this $.get("task1/index.html", testArray ), then opened the window . testArray[0] shows undefined on task1/index.html – user1499220 Aug 13 '13 at 18:40
  • @user1499220 I added an example. – chris-l Aug 13 '13 at 18:49
  • Thank you Chris. Well, maybe I'm accessing the data in a wrong way. Here is how I do in task1/ndex.html $(document).ready(function(data) { console.log((data.images).length); It shows "cannot read property length of undefined" – user1499220 Aug 13 '13 at 18:57
  • Look, ajax calls are not for passing data between windows. While is true you can create an empty window and fill it with data you get from an ajax call (like in the example), ajax is not for that. Is for passing data to a server-side script and the get a callback with the results on the same window. – chris-l Aug 13 '13 at 19:27