HTML 테이블과 함께 정렬 가능한 jQuery UI 사용
HTML 테이블의 데이터베이스에서 일부 데이터를 출력하고 사용자가 테이블 행을 다시 정렬할 수 있기를 원합니다.이를 위해 jQuery UI sortable을 사용했습니다.
<script>
$(function() {
$( "#sortable" ).sortable();
$( "#sortable" ).disableSelection();
});
</script>
<?php
while($row = mysql_fetch_assoc($co_authors)) {
echo "<tr id='sortable'><td>{$row['author_email']}</td>
<td>{$row['coauthor_level']}</td>";
<td><button class='remove' id='remove' name='remove' email="<?php echo $row['author_email'] ?>"
paper="<?php echo $row['paper_id'] ?>">Remove</button></td>
</tr>";
}
?>
문제는 내가 테이블을 끌 때tr
,오직.td
끌려갑니다.또한 가장 중요한 것은 첫 번째 행만 끌 수 있다는 것입니다. 즉, 효과는 다른 행에는 적용되지 않습니다.어떻게 해결해야 하나요?
전화할 수 있습니다.sortable
에서<tbody>
각각의 행 대신에.
<table>
<tbody>
<tr>
<td>1</td>
<td>2</td>
</tr>
<tr>
<td>3</td>
<td>4</td>
</tr>
<tr>
<td>5</td>
<td>6</td>
</tr>
</tbody>
</table>
<script>
$('tbody').sortable();
</script>
$(function() {
$( "tbody" ).sortable();
});
table {
border-spacing: collapse;
border-spacing: 0;
}
td {
width: 50px;
height: 25px;
border: 1px solid black;
}
<link href="//code.jquery.com/ui/1.11.1/themes/smoothness/jquery-ui.css" rel="stylesheet">
<script src="//code.jquery.com/jquery-1.11.1.js"></script>
<script src="//code.jquery.com/ui/1.11.1/jquery-ui.js"></script>
<table>
<tbody>
<tr>
<td>1</td>
<td>2</td>
</tr>
<tr>
<td>3</td>
<td>4</td>
</tr>
<tr>
<td>5</td>
<td>6</td>
</tr>
<tr>
<td>7</td>
<td>8</td>
</tr>
<tr>
<td>9</td>
<td>10</td>
</tr>
</tbody>
</table>
언급URL : https://stackoverflow.com/questions/11470775/using-jquery-ui-sortable-with-html-tables
'programing' 카테고리의 다른 글
템플릿 구문 분석 오류: 'mat-icon'은(는) 알려진 요소가 아닙니다. (0) | 2023.08.27 |
---|---|
php에서 에이잭스를 통해 요청할 때 세션 ID가 변경되는 이유는 무엇입니까? (0) | 2023.08.27 |
테이블 내부에만 테두리를 적용하려면 어떻게 해야 합니까? (0) | 2023.08.27 |
스프링 주석을 사용하여 동일한 클래스의 여러 콩 인스턴스화 (0) | 2023.08.27 |
JavaScript: 문자열의 마지막 텍스트 바꾸기 (0) | 2023.08.27 |