0

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);
showtime
  • 1
  • 1
  • 17
  • 48

4 Answers4

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 }
 });
William Carneiro
  • 297
  • 1
  • 8
  • I am using Fetch not Ajax – showtime Dec 15 '20 at 12:52
  • and I have an array not an object – showtime Dec 15 '20 at 13:00
  • 1
    In your code snippet you actually created an array of objects because you declared the keys of the values, that's why I tried to help you using the same way. But, even if you have an common javascript array, my answer still works. Also, you don't specified the method you are passing the data to php in your question, that's why I gave the Ajax example. Next time, try to be more specific in your questions. – William Carneiro Dec 15 '20 at 13:06
  • thanks, I just edited my question. I also changed the array format. Please take a look – showtime Dec 15 '20 at 13:09
1

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']);
William Carneiro
  • 297
  • 1
  • 8
  • almost there, but it gives me this weird looking array when I print it in php: `array(3) { [0]=> string(10) ""roadworks" [1]=> string(4) "snow" [2]=> string(9) "blocking"" }` – showtime Dec 15 '20 at 13:27
  • What's weird? I see that roadworks and blocking have a quote inside, that's it? If you are not familiar with `var_dump()`, try to use `var_export()` or `print_r()` to view the array. – William Carneiro Dec 15 '20 at 13:32
0

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");
    }
});
kishor koshti
  • 26
  • 2
  • what about `window.fetch()`? shouldnt it be the same? It doesnt work with fetch, so why would it work with ajax? – showtime Dec 15 '20 at 12:45
0

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.

  1. 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.

GZstudio GZstudio
  • 85
  • 10