insertAfter ne se comporte pas comme insertBefore
Bonjour à tous ,
J'ai un tableau de liste avec un checkbox sur chaque ligne
Le but est de faire un UP ou DOWN (bouton sur l'entête du tableau)pour les lignes qui sont cochés
Mon problème c'est que si je coche deux lignes et je fais UP les 2 lignes cochées montent bien après la precedente ligne
Par contre si je sélectionne 2 lignes et je fais DOWN là ça ne bouge pas , le insertAfter ne se comporte pas comme insertBefore
Voici le code
Code:
1
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
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
| <button id="up">Up</button><button id="down">Down</button>
<table id="rowclick" class="table table-striped table-bordered table-hover flip-content">
<thead class="flip-header">
<tr>
<th colspan="2">
Rank
</th>
<th>
ID
</th>
<th>
Product
</th>
<th> </th>
</tr>
</thead>
<tbody>
<tr class="odd gradeX parent parent-hide" id="item-2119">
<td>
16
</td>
<td>
2119
</td>
<td>
test
</td>
<td class="center">
<input type="checkbox">
</td>
</tr>
<tr class="odd gradeX parent parent-hide" id="item-2120">
<td>
17
</td>
<td>
2120
</td>
<td>
test1
</td>
<td class="center">
<input type="checkbox">
</td>
</tr>
<tr class="odd gradeX parent parent-hide" id="item-2121">
<td>
18
</td>
<td>
2121
</td>
<td>
Test2
</td>
<td class="center">
<input type="checkbox">
</td>
</tr>
<tr class="odd gradeX parent parent-hide" id="item-2122">
<td>
19
</td>
<td>
2122
</td>
<td>
Test 3
</td>
<td class="center">
<input type="checkbox">
</td>
</tr>
<tr class="odd gradeX parent parent-hide" id="item-2123">
<td>
20
</td>
<td>
2123
</td>
<td>
test4
</td>
<td class="center">
<input type="checkbox">
</td>
</tr>
<tr class="odd gradeX parent parent-hide" id="item-2464">
<td>
99999
</td>
<td>
2464
</td>
<td>
test 5
</td>
<td class="center">
</td>
</tr>
</tbody>
</table>
<script type="text/javascript">
$(document).ready(function(){
$("#up").click(function(event){
event.preventDefault();
$("#rowclick").find("input:checkbox:checked").each(function(){
var check_index = $(this).closest('tr').index();
//alert(check_index);
//var check = $(this).closest('tr');
var current = $(this).closest('tr')
var previous = current.prev('tr');
if(previous.length !== 0){
current.insertBefore(previous);
}
});
});
$("#down").click(function(event){
event.preventDefault();
$("#rowclick").find("input:checkbox:checked").each(function(){
var check_index = $(this).closest('tr').index();
//alert(check_index);
//var check = $(this).closest('tr');
var current1 = $(this).closest('tr')
var next = current1.next('tr');
if(next.length !== 0){
alert("OK");
current1.insertAfter(next);
}else{
alert("KO");
}
});
});
});
</script> |
j'ai mis un alert('OK'); et ça rentre bien dedans sauf que le insertAfter ne comporte/marche pas comme insertBefore si on selection plusieurs lignes
Merci pour votre aide
