Ticket #2991: sortable.html

File sortable.html, 6.3 KB (added by gordon, June 11, 2008 11:03PM UTC)

Demonstration of the problem

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript" src="/js/jquery/jquery.js"></script>
<script type="text/javascript" src="/js/jquery/ui/ui.core.js"></script>
<script type="text/javascript" src="/js/jquery/ui/ui.sortable.js"></script>
<script type="text/javascript">
<!--
$(document).ready (function ()
{
	$('.questionGrid tbody').sortable ({handle: '.sortHandle'});
});
-->
</script>
</head>
<body>
<table class="questionGrid" width="100%" border="1" cellpadding="3" cellspacing="3">
  <thead>
    <tr>
      <th> </th>
      <th> </th>
      <th> </th>
      <th> </th>
      <th> </th>
      <th> </th>
      <th> </th>
      <th> </th>
      <th> </th>
      <th> </th>
      <th> </th>
      <th> </th>
      <th> </th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td class="sortHandle"><label>test1</label></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
    </tr>
    <tr>
      <td class="sortHandle"><label>test2</label></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
    </tr>
    <tr>
      <td class="sortHandle"><label>test3</label></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
    </tr>
    <tr>
      <td class="sortHandle"><label>test4</label></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
    </tr>
    <tr>
      <td class="sortHandle"><label>test5</label></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
    </tr>
    <tr>
      <td class="sortHandle"><label>test6</label></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
    </tr>
    <tr>
      <td class="sortHandle"><label>test7</label></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
    </tr>
    <tr>
      <td class="sortHandle"><label>test8</label></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
    </tr>
    <tr>
      <td class="sortHandle"><label>test9</label></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
    </tr>
    <tr>
      <td class="sortHandle"><label>test10</label></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
      <td><input type="radio"/></td>
    </tr>
  </tbody>
</table>
</body>
</html>

Download in other formats:

Original Format