比较简单的排序方法,对于小型的排序,在客户端完成就可,麻烦客户端,以来刷新麻烦来回传数据,二来写代码也容易出错.
调用方法:给datagrid的表头的各个列标题添加onclick事件,然后调用sortTable('tblId', colIndex),分别传入要排序的表或datagrid的id号,要排序的列的索引 例如
<asp:BoundColumn DataField="gb_id" HeaderText="<div onclick="sortTable('dgResult', 0)">ID</div>"></asp:BoundColumn>
1
function compareMutiTRs(colIndex)
2
{
3
return function compareTRs(tr1, tr2)
4
{
5
var value1;
6
var value2;
7
//必须得考虑到 合并单元格的问题
8
var isNull = (tr2.cells[colIndex]== null || tr1.cells[colIndex] == null)
9
if (isNull)
10
{
11
value1 = tr1.cells[0].firstChild.nodeValue;
12
value2 = tr2.cells[0].firstChild.nodeValue;
13
}
14
else
15
{
16
value1 = tr1.cells[colIndex].firstChild.nodeValue;
17
value2 = tr2.cells[colIndex].firstChild.nodeValue;
18
}
19
20
if (value1 > value2)
21
{
22
return 1;
23
}
24
else if (value1 < value2)
25
{
26
return -1;
27
}
28
else
29
{
30
return 0;
31
}
32
}
33
}
34
35
var lastCol = -1;
36
function sortTable(tblId, colIndex)
37
{
38
var tbl = document.getElementById(tblId);
39
var trs = tbl.rows;
40
var arrayTRs = new Array();
41
var lastTR = null;
42
var start;
43
var end;
44
45
var flagUp = trs[0].cells.length == 1;
46
var flagDown = trs[trs.length - 1].cells.length == 1
47
if (flagUp)//如果分页提示在上
48
{
49
start = 2;
50
end = trs.length;
51
}
52
else if (flagDown)//如果分页提示在下
53
{
54
start = 1;
55
end = trs.length -1;
56
}
57
else if (flagUp && flagDown)//上下都有分页提示
58
{
59
start = 2;
60
end = trs.length - 1;
61
}
62
else//上下都没有分页提示
63
{
64
start = 1;
65
end = trs.length;
66
}
67
68
if (trs[trs.length - 2].cells.length != trs[trs.length - 1].cells.length)
69
{
70
lastTR = trs[trs.length - 1];//把最后一行保存起来
71
}
72
73
for (var i = start; i < end; i++)//
74
{
75
arrayTRs.push(trs[i]);
76
}
77
78
if (colIndex == lastCol)
79
{
80
arrayTRs.reverse();
81
}
82
else
83
{
84
arrayTRs.sort(compareMutiTRs(colIndex));
85
}
86
87
var fragment = document.createDocumentFragment();
88
89
for (var j = 0; j < arrayTRs.length; j++)
90
{
91
fragment.appendChild(arrayTRs[j]);
92
}
93
94
if (lastTR != null)
95
{
96
fragment.appendChild(lastTR);
97
}
98
99
tbl.tBodies[0].appendChild(fragment);
100
101
lastCol = colIndex;
102
}

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

46

47

48

49

50

51

52

53

54

55

56

57

58

59

60

61

62

63

64

65

66

67

68

69

70

71

72

73

74

75

76

77

78

79

80

81

82

83

84

85

86

87

88

89

90

91

92

93

94

95

96

97

98

99

100

101

102
