jquery自动完成中的动态参数

Question

我无法在以下代码中动态传递参数过滤器。 过滤器值取决于下拉列表（id =“dataLevel”）值，用于相应地为自动完成生成不同的建议。

HTML代码：

<td>
<select id="dataLevel" name="dataLevel" 
    onchange="enableSearch(this);resetError(this);" >
    <option value="0">-- Select Level --</option>
    <option value="1">Group Level</option>
    <option value="2">Region Level</option>
    <option value="3">Sub Region Level</option>
    <option value="4">Branch Level</option>
</select>&nbsp;&nbsp;&nbsp;
</td>
<td>
    <input value="" name="searchTarget" id="searchTarget" type="text" />
</td>

JAVASCRIPT CODE：

$(document).ready(function() {
    $("#searchTarget").autocomplete(
    "/jsp/AjaxInterface.jsp",{maxItemsToShow:15,extraParams:{filter:getTargetFilter()}}
    );
});

function getTargetFilter() {
    var targetType = document.getElementById('dataLevel').value;
    switch (targetType) {
    case '1':
        return 0;
        break;
    case '2':
        return 26;
        break;
    case '3':
        return 65;
        break;
    case '4':
        return 66;
        break;
    default:
        return 0;
        break;
    }
}

Answer 1

您可以使用source选项并编写自己的AJAX调用来创建对AJAX的更多控制。

$(document).ready(function() {

    $("#searchTarget").autocomplete({
        source: function(request, response) {
            $.getJSON("/jsp/AjaxInterface.jsp", {
                term: request.term,
                filter: getTargetFilter()

            }, response);
        },
        maxItemsToShow: 15
    });
});

请参阅API http://jqueryui.com/autocomplete/#multiple-remote中的Mulitple-Remote演示和“查看SOURce”

Answer 2

每次数据级别值更改时，您都可以更改“过滤器”选项。

function getTargetFilter() {
        var targetType = document.getElementById('dataLevel').value;
        switch (targetType) {
        case '1':
            return 0;
            break;
        case '2':
            return 26;
            break;
        case '3':
            return 65;
            break;
        case '4':
            return 66;
            break;
        default:
            return 0;
            break;
        }
    }

    //Change filter option each time dataLever value change's
    $("#dataLevel").change(function(){
         $("#searchTarget").autocomplete("option","filter",getTargetFilter());
    });