色婷婷狠狠18禁久久YY,CHINESE性内射高清国产,国产女人18毛片水真多1,国产AV在线观看

gridview jquery

黃文隆2年前7瀏覽0評論

GridView是ASP.NET Web Forms中最常用的控件之一,它可以快速簡單地展現一個數據列表。但是,如果需要在列表中進行一些特定的操作,如排序、篩選、分頁等,就需要使用一些復雜的代碼。這時,可以使用jQuery來幫助解決這些問題。

首先,需要引入jQuery代碼,可以通過以下方式:

<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>

然后,可以通過以下代碼來對GridView進行一些常用的操作:

<script>
$(document).ready(function () {
// 對GridView進行排序
$('th').click(function () {
var table = $(this).parents('table').eq(0);
var rows = table.find('tr:gt(0)').toArray().sort(compare($(this).index()));
this.asc = !this.asc;
if (!this.asc) {
rows = rows.reverse();
}
for (var i = 0; i < rows.length; i++) {
table.append(rows[i]);
}
});
// 對GridView進行篩選
$('select').change(function () {
var table = $(this).parents('table').eq(0);
var rows = table.find('tr').not(':first');
rows.each(function (index) {
var cells = $(this).find('td');
if (cells.length > 0) {
var value = cells.eq($(this).parents('table').find('th').index($('select').parent())).text().toLowerCase();
if (value.indexOf($('select option:selected').text().toLowerCase()) < 0) {
$(this).hide();
} else {
$(this).show();
}
}
});
});
});
// 排序函數
function compare(index) {
return function (a, b) {
var valA = getCellValue(a, index);
var valB = getCellValue(b, index);
return $.isNumeric(valA) && $.isNumeric(valB) ? valA - valB : valA.toString().localeCompare(valB);
}
}
// 獲取單元格值
function getCellValue(row, index) {
return $(row).children('td').eq(index).text();
}
</script>

以上代碼實現了GridView的排序和篩選功能。在頁面中添加相應的HTML代碼即可:

<table>
<tr>
<th>姓名</th>
<th>年齡</th>
</tr>
<tr>
<td>張三</td>
<td>20</td>
</tr>
<tr>
<td>李四</td>
<td>22</td>
</tr>
<tr>
<td>王五</td>
<td>25</td>
</tr>
<tr>
<td>趙六</td>
<td>30</td>
</tr>
</table>
<select>
<option value="0">不限</option>
<option value="1">20</option>
<option value="2">22</option>
<option value="3">25</option>
<option value="4">30</option>
</select>

以上代碼實現了一個簡單的GridView列表,并且通過jQuery實現了其中的排序和篩選功能。