How to pass a JavaScript array as parameter to URL and catch it in PHP?

Question

I have an array in JS and I am trying to pass it as parameter to URL and catch it in PHP but I cant get to understand how to do it:

var trafficFilterHolder = ["roadworks","snow","blocking"];
var filters = encodeURI(JSON.stringify(trafficFilterHolder));

FYI: I am using windows.fetch for posting.

in PHP:

$trafficFilters = $_GET["trafficFilters"];
$obj = json_decode($trafficFilters);       
var_dump($obj);

Answer 1

It's quite simple, you are passing these data to php with ajax, correct?

First of all, you are creating the javascript array incorrectly:

var trafficFilterHolder = [0: "roadworks", 1: "snow", 2: "blocking"];

Don't use brackets to create arrays with keys, use this format instead:

var trafficFilterHolder = {0: "roadworks", 1: "snow", 2: "blocking"};

Now, in the ajax, just add the array in the data :

 $.ajax({
     data: { trafficFilters: trafficFilterHolder }
 });

Answer 2

You are passing the data to php with fetch() intead of ajax, so the alternative of my first answer to do the same with the fetch() is:

var trafficFilterHolder = ["roadworks","snow","blocking"];
var trafficFilterHolderJoin = trafficFilterHolder.join(); // comma-separeted format => "roadworks,snow,blocking"

Now add the trafficFilterHolderJoin variable to the traffic query of the URL of your fetch(), like:

fetch('script.php?traffic=' + trafficFilterHolderJoin)

Then in your php script file you will convert the comma-separeted format to php array format using the explode function:

$traffic = explode(",", $_GET['traffic']);

Answer 3

Try using ajax and pass that array and retrieve values at the PHP end.

var filters = encodeURI(JSON.stringify(trafficFilterHolder));

$.ajax({ type: "POST", url: "test.php", data: {data: filters}, cache: false,

    success: function(){
        alert("OK");
    }
});

Answer 4

All demands to the server are executed as an http requests. Ther are two types of HTTP requests - GET and POST.

https://www.w3schools.com/tags/ref_httpmethods.asp

What you're describing is called GET request. With GET request the parameters are passed via the address bar. For making an http request you have two options.

1. The direct HTTP GET request. For this you need simply open a new page with

   window.location.href = 'http://your_site.com/file.php?name1=value1&name2=value2'

This will open a new page in your browser and pass a request with your parameters.

2. An Ajax HTTP GET request. You have a lot of options here:

• an old-fashion way with xmlHttpRequest object
• a modern fetch API with promises
• third-part libraries like jQuery.ajax etc.

AJAX request can send and receive information from the server (either in GET or POST request) without renewing the page. After that the result received can be managed with your javascript application however you want.

Hope, it makes more clear for you. You can search about all this technologies in the google. This is the way how to exchange data from front-end to back-end.