添加空间时自动完成功能无效

时间:2013-04-18 11:34:03

标签: javascript jquery autocomplete

在我的项目中,我尝试使用以下插件创建自动完成效果:

Devbridge jQuery Autocomplete

这个插件工作正常,直到我没有在我的文本框中添加空格(添加单词后)。当我只是使用退格键删除输入的单词时,自动完成功能会显示之前应显示的上一个列表。

PS:每次我通过我的应用程序中必需的ajax调用将文本字段的全文传递给服务器。

这是我的代码:

JS Fiddle 由于ajax网址无法正常工作

JS

$(function () {

    var result = $('#result');
    var contents = {
        value: "",
        data: ""
    };
    /* Ajax call */
    result.keydown(function (event) {
        if (!event.shiftKey) {
            var sugData;
            var text = result.val(); //.split(" ").pop();
            //console.log(text);
            /* Send the data using post and put the results in a div */
            $.ajax({
                url: "http://localhost:9999/projects/1/autocomplete/suggestions",
                type: "POST",
                data: "drqlFragment=" + text, // + "  ",
                //data: "drqlFragment=when node_database_property  ",
                async: false,
                cache: false,
                headers: {
                    accept: "application/json",
                    contentType: "application/x-www-form-urlencoded"
                },
                contentType: "application/x-www-form-urlencoded",
                processData: true,
                success: function (data, textStatus, jqXHR) {
                    var resData = data.suggestions;
                    //console.dir(resData);
                    for (var i = 0; i < resData.length; i++) {
                        resData[i].value = resData[i].keyword;
                    }
                    sugData = resData;
                    //console.dir(sugData);
                },
                error: function (response) {
                    //console.dir(response);
                    $("#result").val('there is error while submit');
                }
            });
            console.dir(sugData);
            $('#result').autocomplete({
                lookup: sugData
            });
        }
    });
});

HTML

<form id="foo">
    <textarea id="result" rows="4" cols="50"></textarea>
    <input type="submit" value="Send" />
</form>

很抱歉,我无法为您提供json数据,因为只要我按下某个键,服务器就会对其进行修改。 (所以,实际上它是服务器在ajax调用时返回的对象变量。)

0 个答案:

没有答案