javascript - jQuery自动完成发送出奇怪的字符

Question

我已经通过Web API成功地将jquery ajax与get和post方法一起使用

但是，现在我有一个任务需要做一个自动完成

我查看了几个示例，但这些示例困扰我一些疯狂的生成URL，这对我来说是陌生的

网址：

http://localhost:11974/GetPersonInfoFromRegister?term=ad&_=1445370940988

“术语”从哪里来？
“ 1445370940988”从哪里来？

的HTML

input type="text" id="txtSearch" />

jQuery：

$(function () {
    $('#txtSearch').autocomplete({
        source: function(request, response) {
            $.ajax({
                url: '/GetPersonInfoFromRegister',
                type: 'GET',
                cache: false,
                data: request,
                dataType: 'json',
                success: function(json) {
                    // call autocomplete callback method with results  
                    response($.map(json, function(name, val) {
                        return {
                            label: name,
                            value: val
                        }
                    }));
                },
                error: function(XMLHttpRequest, textStatus, errorThrown) {
                    //alert('error - ' + textStatus);
                    console.log('error', textStatus, errorThrown);
                }
            });
        },
        minLength: 2,
        select: function(event, ui) {
            alert('you have selected ' + ui.item.label + ' ID: ' + ui.item.value);
            $('#txtSearch').val(ui.item.label);
            return false;
        }
    });
});

Answer 1

我没有对自动完成功能做很多事情，但是在我做的应用程序的一部分中，自动完成功能1是使用Angular，但另一个是使用jquery注释掉的

在被评论之前，它运行良好。

您需要进行一些更改才能使其正常工作。


从GET更改为POST（我记得request和request.term吐出Web api不需要的字符，路由引擎也没有。
只是注意到各种变化，它“应该”起作用

$(function () {

$("#TextBox1").autocomplete({
    source: function (request, response) {
        $.ajax({
            url: '/GetPersonInfoFromRegister/'+request.term,
            data: "{ 'id': '" + request.term + "' }",
            dataType: "json",
            type: "POST",
            //type: "GET",
            contentType: "application/json; charset=utf-8",
            dataFilter: function (data) { return data; },
            success: function (data) {
                response($.map(data, function (item) {
                    return {
                      value: item.YOURMODELPROPERTY

                    }
                }));
            },
            error: function (XMLHttpRequest, textStatus, errorThrown) {
                console.log(textStatus);
            }
        });
    },
    minLength: 2
});

}）;


我将代码与YOURS混合在一起，但是应该很接近

WEB API

[HttpPost]
[Route("GetPersonInfoFromRegister/{id}")]
public IEnumerable<MODELOFYOURS> GetPersonStuff(string id)  // id matches Route
{
   .....
   return _db.MODELOFYOURS.Where(m => m.PROPERTYOFYOURS.Contains(id)).ToList();  

}