如何通过对象构造url参数

Question

我试图为从输入元素中选择的值构造url参数。

例如:我有一个页面，其中有一个文本输入字段和3个选择字段(名称、部门、品牌、模型)，首先我将输入值命名文本字段，然后从部门下拉列表中选择值，然后从品牌下拉列表中选择任何值，然后从模型下拉列表中选择一些值，最后当我按submit时，用户输入的值应该以其键对放入对象，并生成带有$.params(obj)的url params，并将其附加到ajax调用中。我该怎么做呢。下面是我所做的事情的代码。

例：

var obj = {}
//after click on submit

obj = {
    _pick:pick,
    _dept:dept,
    _model:model    // this obj contains no brand object, because i have not selected anything from the brand dropdown
}

html：

<form name="populateForm">
<div class="dom_element">
    <label>Department</label>
    <input type="text" name="pick" id="pick">
</div>

<div class="dom_element">
    <label>Department</label>
    <select id="departmentSelect">
        <option value="0">Select Department</option>
        <option value="122">Department-1</option>
        <option value="123">Department-2</option>
        <option value="124">Department-3</option>
        <option value="125">Department-4</option>
        <option value="126">Department-5</option>
    </select>
</div>

<div class="dom_element">
    <label>Brands</label>
    <select id="brandSelect">
        <option value="0">Select Brand</option>
        <option value="212">Brand-1</option>
        <option value="213">Brand-2</option>
        <option value="214">Brand-3</option>
        <option value="215">Brand-4</option>
        <option value="216">Brand-5</option>
    </select>
</div>

<div class="dom_element">
    <label>Model</label>
    <select id="modelSelect">
        <option value="0">Select Model</option>
        <option value="328">Model-1</option>
        <option value="324">Model-2</option>
        <option value="326">Model-3</option>
        <option value="325">Model-4</option>
        <option value="322">Model-5</option>
    </select>
</div>

</form>
<button class="ApplyFilter">Apply</button>

联署材料：

$(document).ready(function(){
    $('.ApplyFilter').on('click',function(){
        var paramObj = {};
        var pick = $('#pick').val();
        var dept = $('#departmentSelect').val();
        var brand = $('#brandSelect').val();
        var model = $('#modelSelect').val();

    if(pick != ''){
        paramObj = {
            _pick:pick
        }
    }

    if(dept > 0){
        paramObj = {
            _dept:dept
        }
    }

    if(brand > 0){
        paramObj = {
            _brand:brand
        }
    }

    if(model > 0){
        paramObj = {
            _model:model
        }
    }

    /*
        this is the object i am expecting at the end, if any input does not have any value then that should not be in this object
        paramObj = {
            _pick:pick,
            _dept:dept,
            _brand:brand,
            _model:model
        }
    */

    var urlParams = $.params(paramObj);

    if(urlParams.length > 0){
        $.ajax({
            type: "POST",
            url: "/api/getMydata/?"+urlParams,
            success:function(response){
                console.log(response.responseData);
            }
        })
    }

    });
});

Answer 1

而不是

paramObj = {
    _pick:pick
}

就这么做

paramObj._pick = pick;

按照当前的做法，paramObj对象只是在重置每个if语句。