Как отфильтровать данные JSON для автоматического предложения с использованием Ajax (без пользовательского интерфейса jQuery)
Я пытаюсь создать самовнушение с нуля. Я использую контроллер canjs для управления элементами DOM (ul и li). Я хочу умный и короткий код для реализации этого. Я пробовал с фильтром, но я хочу использовать метод фильтра Ajax для этой цели.
Я попробовал следующее:
can.Model:
var SearchDomainModel = can.Model.extend({
findAll: function(){
return this.getDomains;
}
}, { domainList: null,
getDomains: function(params, callback) {
var promise = $.ajax({
url: '/scripts/models/domains.json',
type: 'GET',
dataType: 'json',
dataFilter: function(data, type){
var parsed_data = JSON.parse(data);
var regex = new RegExp(params, 'gi')
var temp = [];
$.each(parsed_data, function(i, item){
for(var j in item)
if ((item[j].url).toLowerCase().indexOf(params) >= 0){
temp.push(item[j].url);
console.log(temp);
}
});
return temp;
}
});
Это мой can.controller:
var DomainController = can.Control.extend({
defaults: {
view: 'views/domainSearch.hbs'
}
}, {
searchList: new can.List(),
domainModel: new DomainModel(),
init: function(element, options) {
this.element.html(can.view(this.options.view, this.searchList));
$('html,body').css({
percentWidth: 100,
percentHeight: 100
});
$('.error').hide();
}, // control domain filter on keyup event
'input keyup': function(element, event) {
var self = this;
var searchText = element.val();
if (searchText !== "") {
this.domainModel.getDomains(searchText, function (response, error) {
self.searchList.attr("domains",response);
console.log(error);
})
Я пытаюсь и ищу в последние два дня. Я не мог этого сделать. Кто-нибудь может подсказать, где моя ошибка в коде и как ее исправить?
Спасибо заранее!!
1 ответ
Решение
Я бы, наверное, сделал что-то вроде этого:
var SearchDomainModel = can.Model.extend({
findAll: function(){
return this.getDomains;
}
}, { domainList: null,
getDomains: (function() {
var domains = null;
function search(searchText, callback){
var regex = new RegExp(searchText, 'gi')
var temp = [];
$.each(domains, function(i, item){
for(var j in item)
if (regex.test(item[j].url))
temp.push(item[j].url);
});
callback(temp);
}
return function(searchText, callback) {
if( domains ) {
search(searchText, callback);
return;
}
$.ajax({
url: '/scripts/models/domains.json',
type: 'GET',
dataType: 'json',
success: function(data) {
domains = data;
search(searchText, callback);
}
});
};
})()
});
Я не тестировал код, но он не порождает один ajax-запрос каждый раз, когда вы отпускаете ключ, а вместо этого захватывает данные один раз, а затем ссылается на те же данные.