Здесь есть одна вещь:
$(".glyphicon .glyphicon-filter").click(function(e) {
filterindex = $(event.target).closest('th').index();
$("#dialog #filterclause").val($("th:eq(" + filterindex + ")").data("filterclause"));
$("#dialog #FirstBox").val($("th:eq(" + filterindex + ")").data("filtervalue"));
$("#dialog").dialog({
position: {
at: "right bottom",
my: "left top",
of: $(e.target)
}
});
$("#dialog").dialog("open");
});
Обратный вызов click передается e, но вы звоните event.target, который не существует. Это должно вызвать ошибку вроде:
Uncaught TypeError: Cannot read property 'type' of undefined
at e.setFieldValue
at HTMLFormElement.formKeydownListener
Сначала необходимо решить эту проблему, чтобы убедиться, что это не ограничитель показа для этой функции.
Во-вторых, элемент $(".glyphicon .glyphicon-filter") не существует. Я не вижу элемент .glyphicon, который содержит .glyphicon-filter как дочерний элемент. Я вижу $(".glyphicon.glyphicon-filter"), и это, кажется, работает правильно.
Вот мой тестовый код: https://jsfiddle.net/Twisty/oLh5wf2z/9/
JavaScript
var filterindex = 0;
$(function() {
$("#dialog").dialog({
autoOpen: false,
closeOnEscape: true,
draggable: true,
title: "Filter Box"
});
$(".glyphicon.glyphicon-filter").click(function(e) {
filterindex = $(e.target).closest('th').index();
$("#dialog #filterclause").val($("th:eq(" + filterindex + ")").data("filterclause"));
$("#dialog #FirstBox").val($("th:eq(" + filterindex + ")").data("filtervalue"));
$("#dialog").dialog({
position: {
at: "right bottom",
my: "left top",
of: $(e.target)
}
});
$("#dialog").dialog("open");
});
$("#close").click(function() {
$("#dialog").dialog("close");
});
$("#ApplyFilter").click(function(e) {
e.preventDefault();
$("th:eq(" + filterindex + ")").data("filterclause", $("#filterclause").find("option:selected").text());
$("th:eq(" + filterindex + ")").data("filtervalue", $("#FirstBox").val());
FilterAddressTable();
});
function FilterAddressTable() {
$("#AddressTable tr").each(function() {
$(this).show();
});
$("#AddressTable th").each(function() {
var headerindex = $(this).index();
$(this).closest("table").find("tr:has(td):visible").each(function() {
if (!$("th:eq(" + headerindex + ")").data("filtervalue")) {
$("th:eq(" + headerindex + ")").find("span:has(i.glyphicon.glyphicon-filter)").find("i.glyphicon.glyphicon-filter").css("visibility", "hidden");
} else {
$("th:eq(" + headerindex + ")").find("span:has(i.glyphicon.glyphicon-filter)").find("i.glyphicon.glyphicon-filter").css("visibility", "visible");
switch ($("th:eq(" + headerindex + ")").data("filterclause")) {
case "Equals":
if ($(this).find("td:eq(" + headerindex + ")").text() === $("th:eq(" + headerindex + ")").data("filtervalue")) {
$(this).show();
} else {
$(this).hide();
}
break;
case "Contains":
if ($(this).find("td:eq(" + headerindex + ")").is(":contains(" + $("th:eq(" + headerindex + ")").data("filtervalue") + ")")) {
$(this).show();
} else {
$(this).hide();
}
break;
case "Does not Contain":
if ($(this).find("td:eq(" + headerindex + ")").is(":not(:contains(" + $("th:eq(" + headerindex + ")").data("filtervalue") + "))")) {
$(this).show();
} else {
$(this).hide();
}
break;
case "Not Equal to":
if ($(this).find("td:eq(" + headerindex + ")").text() != $("th:eq(" + headerindex + ")").data("filtervalue")) {
$(this).show();
} else {
$(this).hide();
}
break;
}
}
});
});
}
$("#ClearFilter").click(function(e) {
e.preventDefault();
$("th:eq(" + filterindex + ")").data("filterclause", "");
$("th:eq(" + filterindex + ")").data("filtervalue", "");
FilterAddressTable();
});
var Options = {
url: "/Addresses/" + "Index",
type: "GET"
};
$.ajax(Options).done(function(data) {
$("#DynamicView").html(data);
});
$(document).ajaxStart(function() {
$("#ProductsTable").css('visibility', 'hidden');
$(".signal").css('visibility', 'visible');
});
$(document).ajaxComplete(function() {
$("#ProductsTable").css('visibility', 'visible');
$(".signal").css('visibility', 'hidden');
});
});
Обновление
Пожалуйста, оставьте отзыв: https://www.w3schools.com/cssref/css_selectors.asp
jQuery и CSS используют селекторы, чтобы помочь идентифицировать объекты.
.class1.class2 Выбирает все элементы с именами name1 и name2, установленными в его атрибуте класса
.class1 .class2 Выбирает все элементы с именем2, которое является потомком элемента с именем1
Надеюсь, это поможет.
element>element Выбирает все элементы
, родительским элементом которых является
Надеюсь, это поможет.