将下拉列表值传递给PHP CodeIgniter中的URI

Question

我正在从事CodeIgniter项目。在web-app中，我要使用data-tables过滤processing on server drop-down lists，并从下拉列表框中选择多个值。我得到了正确的输出。

我的查看代码是：

<div class="content-wrapper">
<div class="box-body">
    <form name="listproperty" action="" method="post" role="form" id="form-filter">
        <div class="row">
            <div class="col-md-3">
                <label>Area: </label>
                <select class="form-control", name="area_name" id="area_name">
                    <option value="0">Select Area</option>
                    <?php 
                        $area_id; 
                        foreach ($areaList as $area) { ?>
                            <option value="<?= $area->area_id_primary; ?>" <?php if ($area->area_id_primary == $area_id) { echo "selected='selected'"; } ?>><?= $area->area_name; ?></option>
                        <?php } ?>
                </select>
            </div>
            <div class="col-md-3">
                <label>City: </label>
                <select class="form-control" name="city_name" id="city_name" multiple="">
                    <option value="">Select City</option>
                    <?php $ct = explode(' ', $city); 
                        foreach ($propertyCityList as $propertyCity) { 
                            $selected = false;
                            foreach ($ct as $usercity) { 
                                if ($usercity == $propertyCity->city_id_primary) {
                                    $selected = true;
                                    break;
                                }
                            } ?>
                            <option value="<?= $propertyCity->city_id_primary; ?>" <?php if($selected === true) { echo "selected='selected'"; } ?>><?= $propertyCity->city_name; ?></option>
                    <?php } ?>
                </select>
            </div>
        </div>
        <div class="row">&nbsp;</div>
        <div class="row">
            <div class="pull-right">
                <div class="col-md-12">
                    <button type="button" id="btn-filter" class="btn btn-success" style="margin-right: 25px;">Filter</button>
                    <button type="button" id="btn-reset" class="btn btn-default">Reset</button>
                </div>
            </div>
        </div>  
    </form>
</div><hr>
<div class="box-body">
    <table class="table table-striped table-bordered" id="listpropertyData" cellspacing="0" width="100%">
        <thead>
            <tr>
                <th width="10%">Added Date</th>
                <th width="10%">ASYS No.</th>
                <th width="18%">Address</th>
                <th width="10%">City</th>
                <th width="15%" style="text-align: center;">Action</th>
            </tr>
        </thead>
        <tfoot>
            <tr>
                <th>Added Date</th>
                <th>ASYS No.</th>
                <th>Address</th>
                <th>City</th>
                <th style="text-align: center;">Action</th>
            </tr>
        </tfoot>
    </table>
</div>

<script type="text/javascript">
    var property;
    $(document).ready(function() {

        $("#area_name").select2();
        $("#city_name").select2();

        property = $('#listpropertyData').DataTable({
            "processing": true,
            "serverSide": true,
            "ajax": {
                "url": "<?= base_url('Controller/getPropertyDatatable'); ?>",
                "type": "POST",
                "dataType": "JSON",
                "data": function ( data ) {
                    data.area_name = $('#area_name').val();
                    data.city_name = $('#city_name').val();
                }
            },
            "dom": '<"top"fli>rt<"bottom"p><"clear">',
            "lengthMenu": [[25, 50, 100, 200, -1], [25, 50, 100, 200, "All"]],
            "columnDefs": [
                {
                    "targets":[7],
                    "orderable":false
                },
            ],
        });

        $('.dataTables_filter input[type="search"]').css(
            {'width':'450px','display':'inline-block'}
        );

        $('#btn-filter').click(function(){ //button filter event click
            property.ajax.reload();  //just reload table
        });
        $('#btn-reset').click(function(){ //button reset event click
            $('#form-filter')[0].reset();
            property.ajax.reload(); 
            window.location.reload(); //just reload table
        });
    });
</script>

我的控制器代码：

public function listProperty()
{
    # code...
    $data['areaList'] = $this->property_model->areaList();
    $data['propertyCityList'] = $this->property_model->propertyCityList();
    $this->global['pageTitle'] = 'RoxAI-ePro : Property List';
    $this->loadViews("property/listProperty", $this->global, $data, NULL);
}
public function getPropertyDatatable()
{
    # code...
    $listProperty = $this->property_model->getPropertyDatatable();

    $data = array();
    foreach ($listProperty as $property) {
        # code...
        $added_on=$property->property_added_on;
        $added_on_date = str_replace('/', '-', $added_on);
        $property_added_on_date=date('d/m/Y', strtotime($added_on_date));

        $row = array();
        $row[] = $property_added_on_date;
        $row[] = $property->property_asys_number;
        $row[] = $property->property_address;
        $row[] = $property->city_name;
        $row[] = 'Action';

        $data[] = $row;
    }
    $output = array(
        'draw' => $_POST['draw'],
        'recordsTotal' => $this->property_model->countPropertyAll(),
        'recordsFiltered' => $this->property_model->countPropertyFiltered(),
        'data' => $data,
    );
    echo json_encode($output);
}

我的问题是如何在URL中传递该下拉列表值，以便在尝试copy-paste URL并在另一个具有相同选择值的浏览器中打开它时可以直接获得相同的结果，下来吗？