Я использую KendoUI Grid (веб-фреймворк). Он заполняется из локальных данных json, который загружается с ASP.NET MVCViewBag при загрузке страницы. Я объявляю источник данных в отдельной переменной перед инициализацией сетки и заполнением данными из datasoruce. У меня возникает проблема, когда меню фильтров прерывается после первой фильтрации или очистки (смотрите изображение). Каждый раз, когда я нажимаю кнопку фильтра или очистки, он скрывает больше элементов управления, пока не осталось только две кнопки. Странно, что в консоли отсутствуют ошибки. Я работаю над этой проблемой в течение более одной недели, но я не могу найти никакой информации об этом, и я не приближаюсь к возможному решению.Меню настройки пользовательского фильтра KendoUI после первой фильтрации или очистки
Я знаю, что не-английский код может быть трудно понять, но я буду счастлив перевести и объяснить, что это значит!
К сожалению, я не могу дать ссылку на сервер, где эта страница работает, как это требует логина и страница уже релиз развернутое что означает, что не было бы хорошая идея, чтобы положить полномочия общественности. Хотя я изо всех сил пытался собрать рабочую скрипку, я не смог заставить ее работать.
Я использую этот код:
root.seznamDataSource = new kendo.data.DataSource({
data: zahteveData,
pageSize: 15,
schema: {
model: {
fields: {
IdZahteve: {
type: "number"
},
Naslov: {
type: "string"
},
Datum: {
type: "date"
},
Status: {
type: "string"
},
Narocnik: {
type: "string"
},
PoslovniPartner: {
type: "string"
}
}
}
},
change: function(e) {
var urejeniItemi;
if ((e.sender._sort != null)
&& (e.sender._sort[0] != null)
&& e.sender._sort[0].field === "Status") {
e.preventDefault();
urejeniItemi = [];
return $.getJSON("/Zahteve/StatusiData", function(data) {
var item, status, _i, _j, _len, _len1, _ref;
for (_i = 0, _len = data.length; _i < _len; _i++) {
status = data[_i];
_ref = e.items;
for (_j = 0, _len1 = _ref.length; _j < _len1; _j++) {
item = _ref[_j];
if (item.Status.trim().toLowerCase() === status.Opis.trim().toLowerCase()) {
urejeniItemi.push(item);
}
}
}
if (urejeniItemi.length !== e.items.length) {
console.log("napaka, niso urejeni vsi itemi");
return;
}
if (e.sender._sort[0].dir === "desc") {
urejeniItemi.reverse();
return e.items = urejeniItemi;
}
});
}
}
});
Я зарегистрировал изменения слушателя событий, так что я могу применить определенную сортировку. После того, как источник данных инициализируется, я начала инициализации KendoUI Grid:
$("#odprte-zahteve").kendoGrid({
dataSource: root.seznamDataSource,
columns: [
{
template: '<span data-idZahteve="#=IdZahteve#"></span>#=Naslov#',
field: "Naslov",
title: "Naslov zahteve",
attributes: {
style: "min-width: 110px!importnat; text-indent: 10px;"
},
filterable: {
ui: naslovFilter
}
}, {
field: "Datum",
title: "Datum zahteve",
format: "{0: dddd, dd. MMMM 'yy}",
attributes: {
style: "min-width: 105px!importnat;"
},
filterable: {
extra: true,
ui: function(element) {
element.kendoDatePicker({
depth: "month",
max: new Date(),
format: "dddd,d. MMMM yyyy",
ARIATemplate: "#=datumZImenom(data.current)#",
footer: "Danes - #=datumZImenom(data)#"
});
}
}
}, {
field: "Status",
title: "Status",
attributes: {
style: "min-width: 60px!importnat;"
},
filterable: {
ui: statusFilter
}
}, {
field: "Narocnik",
title: "Naročnik",
attributes: {
style: "min-width: 80px!importnat;"
},
filterable: {
ui: narocnikFilter
}
}, {
field: "PoslovniPartner",
title: "Poslovni partner",
attributes: {
style: "min-width: 100px!importnat;"
},
filterable: false,
sortable: false
}
],
change: function(e) {
return urediZahtevo(getIzbranaZahteva(this));
},
dataBound: prilagodiSirino,
selectable: true,
sortable: true,
pageable: {
buttonCount: 5,
pageSizes: [15, 30, 45],
messages: {
display: "Prikazujem {0} - {1} od {2} odprtih zahtev",
empty: "Ni podatkov",
itemsPerPage: "zahtev na stran",
next: "Pojdi na naslednjo stran",
first: "Pojdi na prvo stran",
previous: "Pojdi na prejšnjo stran",
last: "Pojdi na zadnjo stran",
refresh: "Osvežite tabelo"
}
},
filterable: {
extra: false,
operators: {
string: {
eq: "Je enak",
startswith: "Se začne z",
contains: "Vsebuje"
},
date: {
lt: "Pred datumom",
gt: "Po datumu",
eq: "Je enak datumu"
}
},
messages: {
and: "in",
or: "ali",
filter: "Filtriraj",
clear: "Počisti",
info: "Filtriraj po: ",
selectValue: "Izberite kategorijo"
}
}
});
Функции фильтра пользовательского интерфейса только создание основных меню фильтров
naslovFilter = function(element) {
element.kendoAutoComplete({
dataSource: zahteveData,
dataTextField: "Naslov"
});
};
datumFilter = function(element) {
element.kendoDatePicker({
depth: "month",
max: new Date(),
format: "dddd,d. MMMM yyyy",
ARIATemplate: "#=datumZImenom(data.current)#",
footer: "Danes - #=datumZImenom(data)#"
});
};
statusFilter = function(element) {
var item, status, statusi, _i, _len;
statusi = [];
for (_i = 0, _len = zahteveData.length; _i < _len; _i++) {
item = zahteveData[_i];
status = item.Status.trim();
if (!statusi.contains(status)) {
statusi.push(status);
}
}
element.kendoDropDownList({
dataSource: statusi,
optionLabel: "Izberite status"
});
};
narocnikFilter = function(element) {
element.kendoDropDownList({
dataSource: narocniki,
optionLabel: "Izberite naročnika"
});
};
Edit: Я начал работать над этот проект снова, и менеджер решил полностью переделать его, поэтому теперь я использую Bootstrap с Angular.js, что устраняет необходимость использования KendoUI.
Подготовка демо-версии (на jsbin.com или jsfiddle.net) поможет нам отследить проблему. –
, если вы можете создать тестовую страницу, которая только что читает, тогда эта ссылка поможет, так как в скрипке вам придется привязать источник данных, и это будет еще небезопасно. хотя, если вы считаете, что это невозможно, создайте рабочий скрипт, как сказал @AtanasKorchev. – MarmiK
Я работаю над этим, но в настоящее время я не могу предоставить тестовому пользователю вход на веб-страницу. –