Passing Arrays as Url Parameter

How to pass an array within a query string?

Here's what I figured out:

Submitting multi-value form fields, i.e. submitting arrays through GET/POST vars, can be done several different ways, as a standard is not necessarily spelled out.

Three possible ways to send multi-value fields or arrays would be:

• ?cars[]=Saab&cars[]=Audi (Best way- PHP reads this into an array)
• ?cars=Saab&cars=Audi (Bad way- PHP will only register last value)
• ?cars=Saab,Audi (Haven't tried this)

Form Examples

On a form, multi-valued fields could take the form of a select box set to multiple:

<form> 
    <select multiple="multiple" name="cars[]"> 
        <option>Volvo</option> 
        <option>Saab</option> 
        <option>Mercedes</option> 
    </select>
</form>

(NOTE: In this case, it would be important to name the select control some_name[], so that the resulting request vars would be registered as an array by PHP)

... or as multiple hidden fields with the same name:

<input type="hidden" name="cars[]" value="Volvo">
<input type="hidden" name="cars[]" value="Saab">
<input type="hidden" name="cars[]" value="Mercedes">

---

NOTE: Using field[] for multiple values is really poorly documented. I don't see any mention of it in the section on multi-valued keys in Query string - Wikipedia, or in the W3C docs dealing with multi-select inputs.

---

UPDATE

As commenters have pointed out, this is very much framework-specific. Some examples:

Query string:

?list_a=1&list_a=2&list_a=3&list_b[]=1&list_b[]=2&list_b[]=3&list_c=1,2,3

Rails:

"list_a": "3", 
"list_b":[
    "1",
    "2",
    "3"
  ], 
"list_c": "1,2,3"

Angular:

 "list_a": [
    "1",
    "2",
    "3"
  ],
  "list_b[]": [
    "1",
    "2",
    "3"
  ],
  "list_c": "1,2,3"

(Angular discussion)

See comments for examples in node.js, Wordpress, ASP.net

---

Maintaining order:
One more thing to consider is that if you need to maintain the order of your items (i.e. array as an ordered list), you really only have one option, which is passing a delimited list of values, and explicitly converting it to an array yourself.

how to send an array in url request

Separate with commas:

http://localhost:8080/MovieDB/GetJson?name=Actor1,Actor2,Actor3&startDate=20120101&endDate=20120505

or:

http://localhost:8080/MovieDB/GetJson?name=Actor1&name=Actor2&name=Actor3&startDate=20120101&endDate=20120505

or:

http://localhost:8080/MovieDB/GetJson?name[0]=Actor1&name[1]=Actor2&name[2]=Actor3&startDate=20120101&endDate=20120505

Either way, your method signature needs to be:

@RequestMapping(value = "/GetJson", method = RequestMethod.GET) 
public void getJson(@RequestParam("name") String[] ticker, @RequestParam("startDate") String startDate, @RequestParam("endDate") String endDate) {
   //code to get results from db for those params.
 }

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

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']);

Passing arrays as url parameter

There is a very simple solution: http_build_query(). It takes your query parameters as an associative array:

$data = array(
    1,
    4,
    'a' => 'b',
    'c' => 'd'
);
$query = http_build_query(array('aParam' => $data));

will return

string(63) "aParam%5B0%5D=1&aParam%5B1%5D=4&aParam%5Ba%5D=b&aParam%5Bc%5D=d"

http_build_query() handles all the necessary escaping for you (%5B => [ and %5D => ]), so this string is equal to aParam[0]=1&aParam[1]=4&aParam[a]=b&aParam[c]=d.

How to pass an array in query parameter url react

you would need to use URLSearchParams to build your params with multiple query with same name.

Iterate over search and for each value you append to your params a new status value:

const getFilterData = (search, pageNumber) => {
    const params = new URLSearchParams();
    search.forEach(value => params.append('status', value));

    if (pageNumber) {
        params.append('page', pageNumber) ;
    }
    axios.get("/api/influencers", { params }).then(res => {
        setState({
            items: res.data.data
        });
    });
};

Pass an array as url parameter and redirect to new page

with jQuery $.param function you can convert array to http query

var data = {myArr: [1,2,3,4,5]};
console.log("index.php?" + $.param(data));    
// index.php?myArr%5B%5D=1&myArr%5B%5D=2&myArr%5B%5D=3&myArr%5B%5D=4&myArr%5B%5D=5

Passing an array/slice as a url parameter

Your parameters in GET request aren't arrays.

rgba1=0&rgba1=250&rgba1=0&rgba1=230&rgba1=0&rgba1=127&rgba1=0&rgba1=0

Creates an array rgba1=[0,250,0,230,0,127,0,0]

See https://golang.org/pkg/net/url/#Values

---

Related Topics