私はオンライン販売のウェブサイト上にあるフィルタのような剣道フィルターを設定したいと思います。 Image for reference剣道UIグリッドカスタムフィルター（ボックス外のデフォルト機能付き）
ここでは、プログラムはグループと学校に関連付けられ、開始日と終了日が設定されます。私はカスタムコードを使ってフィルターを設定していましたが、何らかの形でkendoグリッドフィルターメニューを更新して、このタイプのレイアウトをフィルターにかけることができますか？ ここでは、フィルタ領域の情報がグリッド（学校、日付、グループ）に表示されません。
ありがとうございます事前にありがとうございます
以下のコンセプトの証拠を見つけてください。
これは、あなたがやっていることを達成することが可能であるという概念です。確かに、より多くの研究の必要性があります。チェックボックスをチェックしてチェックを外し、目的のチェックを外す方が良い方法を考えてください。
は、ここでは、このFILTER HIDDEN COLUMN
HTML
を参照してください
<!DOCTYPE html>
<html>
<head>
<link href="http://cdn.kendostatic.com/2012.2.710/styles/kendo.common.min.css" rel="stylesheet" type="text/css" />
<link href="http://cdn.kendostatic.com/2012.2.710/styles/kendo.default.min.css" rel="stylesheet" type="text/css" />
<link href="http://cdn.kendostatic.com/2012.2.710/styles/kendo.dataviz.min.css" rel="stylesheet" type="text/css" />
<link href="http://cdn.kendostatic.com/2012.2.710/styles/kendo.mobile.all.min.css" rel="stylesheet" type="text/css" />
<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<script src="http://cdn.kendostatic.com/2012.2.710/js/kendo.all.min.js"></script>
<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<span> Group1 <input type="checkbox" id="group1"/><br/>
<span> Group2 <input type="checkbox" id="group2"/>
<br/>
<br/>
Date: <input id="date" />
<br/>
<br/>
<br/>
<br/>
<div id="grid"></div>
</html>
JavaScriptのHIDDEN列フィルタFOR JSBIN http://jsbin.com/bakediseci/edit?html,js,output
です：
var data = [
{ name: "Paul", birthDate: new Date("1948/12/08"),Group:"Group1" },
{ name: "Janet", birthDate: new Date("1952/02/19"),Group:"Group1" },
{ name: "Nancy", birthDate: new Date("1963/08/30"),Group:"Group2" },
{ name: "Steven", birthDate: new Date("1937/09/19"),Group:"Group2" }
];
$(document).ready(function() {
var grid = $("#grid").kendoGrid({
dataSource: data,
columns: [
{field: "birthDate", format: "{0:d}" },
{field:"name"},
{field:"Group"}
]
}).data("kendoGrid");
$(document).ready(function() {
//set initial state.
$('#group1').val($(this).is(':checked'));
$('#group2').val($(this).is(':checked'));
$('#group1').change(function() {
if($(this).is(":checked")) {
$("#grid").data("kendoGrid").dataSource.filter({field:"Group",operator:"eq",value:"Group1"});
}else {
grid.dataSource.filter({});
}
});
$('#group2').change(function() {
if($(this).is(":checked")) {
$("#grid").data("kendoGrid").dataSource.filter({field:"Group",operator:"eq",value:"Group2"});
}else {
grid.dataSource.filter({});
}
});
});
$("#date").kendoDatePicker({
change: function() {
var value = this.value();
if (value) {
grid.dataSource.filter({
field: "birthDate",
operator: "eq",
value: value
});
} else {
grid.dataSource.filter({});
}
}
});
});
OUTPUT
あなたは
道を必要になります研究参考になったリンクは、研究および使用するソースは間違いなくありましたあなたは それらを通過する必要があります再びそれを固めるために。必要に帰属してCC-wikiの下でライセンス
あなたの助けと時間のおかげでありがとう、これは確かに私はいくつかの他の方法は、（私が取り組んでいたアプリケーションで行わなければならなかったデッドラインや他のもののために）目的の機能を得るために、現時点では、フィルタ基準をデータとしてアクションに渡し、クライアント側ではなくサーバー側でレコードをフィルタリングします。今週末にあなたの方法を試してみます。 –
@よろしくお願いいたします。結果と一緒に投稿してください。私は本当にあなたのUXベースのアイデアがグリッドからフィルタを通過するのが好きだった –
@sean chのおかげで、私はフィルタメニューを表示するには、「filterMenuInit」イベントを使用したくない、それはユーザー（UX）に、それはより多くの目に見える持っているグリッドの外にする必要があります。また、フィルタリングのためのフィールドは、列などとしてグリッドに表示されません。 –
フィルタリングのためのフィールドは、チェックボックスとグリッドの読み取りとリフレッシュを個別に制御するために何をすることができるのか、何度もフィルタが組み込まれていません。 –
フィルタリングのフィールドは、グリッドとして列に表示されません。このため、目的の色を隠すことができます –