Hello,
I have a table which have a droppable <tr> and draggable <div>s . In the drop function, I'm always getting the 1st row of the table even if I drop on another row of the table when using IE8. It works in other browsers. Live demo :
http://jsbin.com/anogo3
- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
- <html>
- <head>
- <script type="text/javascript" src="jquery.js"></script>
- <script type="text/javascript" src="jquery-ui-1.8.4.custom.min.js"></script>
- <script type="text/javascript">
- $(document).ready(function() {
- $("#containment-wrapper div").draggable({
- revert: true,
- cursor: 'move',
- });
- $("#containment-wrapper tr").droppable({
- drop: function(event, ui) {
- alert("Dropped on " + $(this).attr('id'));
- }
- });
- });
- </script>
- </head>
- <body>
- <div>
- <h2> </h2>
- </div>
- <table id="containment-wrapper" border="1">
- <tbody >
- <tr class="odd" id="myid1">
- <td style="text-align: left; width: 20%;"><div id="cell1">CELL 1</div></td>
- </tr>
- <tr class="odd" id="myid2">
- <td style="text-align: left; width: 20%;"><div id="cell2">CELL 2</div>
- </td>
- </tr>
- <tr class="odd" id="myid3">
- <td style="text-align: left; width: 20%;"><div id="cell3">CELL 3</div>
- </td>
- </tr>
- </tbody>
- </table>
- </body>
- </html>
If I remove line 1 or line 24 - 26 the bug disappears ?!
Any ideas what's wrong ?