我们怎么能有自动完成组合与无限滚动?我发现了一个带有无限滚动的自动完成的jquery UI,但是这个自动完成通过pagemethods获取数据。但我想在MVC应用程序中使用它,并希望使用控制器的动作来检索数据。要使用pagemethos自动补全功能,应该这样做:
$(document).ready(function () {
//Input for testing purposes
$("#inp").smartautocomplete({
getDataFunc: getData,
pageSize: 15,
autoFocus: true
});
});
//Function the SA plugin called when data is needed.
var getData = function (input, pageIndex, pageSize, callback) {
PageMethods.GetData(input, pageIndex, pageSize, function (response) {
if (response) {
response = $.map(response, function (item) {
return {
label: item,
value: item
}
});
callback(response);
}
else callback();
});
};
但是我改变了获取数据的方式,使用$.ajax:
var getData = function (input, pageIndex, pageSize, callback) {
$.getJSON(
{ url: '@Url.Action("GetData", "Home")' },
{ input: input, pageIndex: pageIndex, pageSize: pageSize },
function (response) {
if (response) {
response = $.map(response, function (item) {
return {
label: item,
value: item
};
});
callback(response);
}
else callback();
});
};
但它不起作用,并且没有调用该操作。这个自动完成可以在这里访问:http://www.codeproject.com/Articles/325719/JQueryUI-smartAutocomplete?fid=1683905
我想知道是否有任何其他的解决方案有自动完成与无限滚动
将PageMethod调用替换为AJAX调用
$.ajax({
url: '@Url.Action("GetData", "Default")',
type: 'GET',
dataType: 'json',
data: {
input: input,
pageIndex: pageIndex,
pageSize: pageSize
},
success: function (response) {
//alert(response);
if (response) {
response = $.map(response, function (item) {
return { label: item, value: item };
});
callback(response);
} else {
callback();
}
},
error: function (e) {
alert('error' + e);
},
contentType: 'application/json; charset=utf-8'
});
确保控制器动作返回JSONResult
return new JsonResult {JsonRequestBehavior = JsonRequestBehavior.AllowGet, Data = data };//new {result = data}