Ajax更改URL参数

Question

Now i have javascript code that switch page(reloads) it to something like this after user checks a checkbox

http://localhost:8000/products/all-products?country=1

when user clicks on other checkbox it changes 1 to 2, for example. But what i would like to achieve is something like this : ?country=[1,2] or if there is only one parameter than it can be ?country=1 or ?country=[1], if there are checked more than one checkbox, it needs to be separated by a comma.

JS code :

   $('input[type="checkbox"]').on('change', function(e){
    $.ajaxSetup({
        headers: {
            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        }
    });
    var data = {},
        fdata = [],
        loc = $('<a>', {href:window.location})[0];

    $('input[type="checkbox"]').each(function(i){
        if(this.checked){
            if(!data.hasOwnProperty(this.name)){
                data[this.name] = [];
            }
            data[this.name].push(this.value);
        }
    });

    $.each(data, function(k, v){
        fdata[k] = [v.join(',')];

    });

    var countryArr = fdata["country"];
    fdata = countryArr.join('&');
    $.post('/wines/all-wines/', fdata);
    console.log(fdata);

    if(history.pushState){
        history.pushState(null, null, loc.pathname+'?country='+fdata);

        window.location.href = loc.pathname+'?country='+fdata;
    }
});

Thank you very much!