Question

好的，我正在尝试在HTML datalist标签中显示相关的搜索结果，因为用户将文本输入到HTML文本输入中。为实现这一目标，我有以下HTML / JS：

exchange.getIn().setHeader("JMS_IBM_MQMD_MsgId",MsgExtFileName().getBytes())
exchange.getIn().setHeader("JMS_IBM_Format", MQC.MQFMT_STRING)

在Django中向此基于类的视图发送AJAX请求：

<input class="search-input" autocomplete="off" id="txtSearch" list="suggestions" onkeyup="searchOpen()" value="{{ query }}" type="text" name="query">
<datalist id="suggestions"></datalist>

<script type="text/javascript">

    jQuery.curCSS = function(element, prop, val) {
        return jQuery(element).css(prop, val);
    };

    function searchOpen() {
        var search = $('#txtSearch').val()
        var data = { search: search };

        $.ajax({
            url: 'ajax/search_suggestions/',
            data: data,
            dataType: 'jsonp',
            jsonp: 'callback',
            minLength: 3,
            jsonpCallback: 'searchResult'
        });
    }

    function searchResult(data) {

        var dataList = document.getElementById('suggestions');

        data.forEach(function(item) {
            var option = document.createElement('option');
            option.value = item;
            dataList.appendChild(option);
        });
    };
</script>

假设我有一个包含以下条目的数据库表：

{'aa'，'ab'，'ac'，'ad'，'ae'，'af'}

如果我输入一个字母，例如'a'。我得到了以'a'开头的前5个结果：

{'aa'，'ab'，'ac'，'ad'，'ae'}

这是预期的行为。但是，当我键入第二个字母时，它会进一步切片最初返回的QuerySet，而不是创建一个新的Query。因此'ae'返回一个结果，但'af'不返回任何结果。如何在每次用户输入文本时创建新的数据库查询？

Answer 1

我怀疑是AJAX计时问题。 $ .ajax（）可能需要一段时间才能运行。您正在尝试在AJAX调用之外构建数据，并且可能是当您进入下一个调用时，前一个调用仍在运行，或者类似的情况。 alert（）会有效地迫使事情变慢。尝试：

function searchOpen() {
    $.ajax({
        url: 'ajax/search_suggestions/',
        data: { search: $('#txtSearch').val(); },
        dataType: 'jsonp',
        jsonp: 'callback',
        minLength: 3,
        jsonpCallback: 'searchResult'
    });
}

Django：AJAX查询返回当前和之前ResultSet的交集

1 个答案: