过去我使用jQuery / Ajax来捕获最终用户的按键,并构建一个WHERE子句来过滤Web表单上的数据。
我现在正在利用ASP.NET 4.5中的强类型。我想知道是否有人可以在Gridview上进行实时过滤/搜索。
基本上,我有三个网格,都显示不同的信息。我希望最终用户键入或从下拉列表中选择(通用搜索),所有网格都会反映这些变化。
我并不反对采用旧方法,只是没有;知道我能用什么新东西吗?
答案 0 :(得分:2)
所以你可以看看this。我希望这能帮到你。
这是HTML:
<input id="searchInput" value="Type To Filter">
<br/>
<table>
<thead>
<tr>
<th>Column1</th>
<th>Column2</th>
</tr>
</thead>
<tbody id="fbody">
<tr>
<td>cat</td>
<td>one</td>
</tr>
<tr>
<td>dog</td>
<td>two</td>
</tr>
<tr>
<td>cat</td>
<td>three</td>
</tr>
<tr>
<td>moose</td>
<td>four</td>
</tr>
<tr>
<td>mouse</td>
<td>five</td>
</tr>
<tr>
<td>dog</td>
<td>six</td>
</tr>
</tbody>
</table>
这是JavaScript代码:
$("#searchInput").keyup(function () {
// Split the current value of searchInput
var data = this.value.split(" ");
// Create a jQuery object of the rows
var jo = $("#fbody").find("tr");
if (this.value == "") {
jo.show();
return;
}
// Hide all the rows
jo.hide();
// Recusively filter the jquery object to get results.
jo.filter(function (i, v) {
var $t = $(this);
for (var d = 0; d < data.length; ++d) {
if ($t.is(":contains('" + data[d] + "')")) {
return true;
}
}
return false;
})
// Show the rows that match.
.show();
}).focus(function () {
this.value = "";
$(this).css({
"color": "black"
});
$(this).unbind('focus');
}).css({
"color": "#C0C0C0"
});