如何在 ASP.NET MVC GridView 中添加用于过滤的行?
How can I add row for filtering in ASP.NET MVC GridView?
我正在使用 ASP.NET GridView 来显示来自网络服务调用的数据。我需要在 header 之后添加一行,其中将包含一个文本框以在相应的列中进行搜索。我该怎么做?
除非您使用第三方库,否则 asp.netmvc 中没有 GridView。
您是否渲染了 GridView?如果不是,那么您是否正在考虑服务器 side/client 端分页?
对于这两种情况,请考虑 Html DataTable。使用 DataTable,您只需编写以下代码即可获得具有搜索功能的 GridView:
$(document).ready(function() {
// Setup - add a text input to each footer cell
$('#example thead tr').clone(true).appendTo( '#example thead' );
$('#example thead tr:eq(1) th').each( function (i) {
var title = $(this).text();
$(this).html( '<input type="text" placeholder="Search '+title+'" />' );
$( 'input', this ).on( 'keyup change', function () {
if ( table.column(i).search() !== this.value ) {
table
.column(i)
.search( this.value )
.draw();
}
} );
} );
var table = $('#example').DataTable( {
orderCellsTop: true,
fixedHeader: true
} );
} );
这将为搜索功能呈现一个带有文本框的网格。
在此处查看详细实现:https://datatables.net/extensions/fixedheader/examples/options/columnFiltering.html
我正在使用 ASP.NET GridView 来显示来自网络服务调用的数据。我需要在 header 之后添加一行,其中将包含一个文本框以在相应的列中进行搜索。我该怎么做?
除非您使用第三方库,否则 asp.netmvc 中没有 GridView。
您是否渲染了 GridView?如果不是,那么您是否正在考虑服务器 side/client 端分页?
对于这两种情况,请考虑 Html DataTable。使用 DataTable,您只需编写以下代码即可获得具有搜索功能的 GridView:
$(document).ready(function() {
// Setup - add a text input to each footer cell
$('#example thead tr').clone(true).appendTo( '#example thead' );
$('#example thead tr:eq(1) th').each( function (i) {
var title = $(this).text();
$(this).html( '<input type="text" placeholder="Search '+title+'" />' );
$( 'input', this ).on( 'keyup change', function () {
if ( table.column(i).search() !== this.value ) {
table
.column(i)
.search( this.value )
.draw();
}
} );
} );
var table = $('#example').DataTable( {
orderCellsTop: true,
fixedHeader: true
} );
} );
这将为搜索功能呈现一个带有文本框的网格。
在此处查看详细实现:https://datatables.net/extensions/fixedheader/examples/options/columnFiltering.html