draggable/droppable works in FF2, not IE7
Hi.
I am using jQuery to add column reordering to a table by making the th
elements draggable/droppable. It works perfectly under FF2 but fails
under IE7 with a script error inside jquery-1.2.3.js at the indicated
line below:
jQuery.fn.offset = function() {
var left = 0, top = 0, elem = this[0], results;
if ( elem ) with ( jQuery.browser ) {
var parent = elem.parentNode,
offsetChild = elem,
offsetParent = elem.offsetParent, <<<<<< error breaks here
Under IE, it appears to work the first time I move a column. But
after that, as soon as I try to drag another column, the ghosted
draggable shows up as stuck at the far left of the table header and
drag/drop stuff no longer works at all. Again, it all works perfectly
under FF2.
The table in question is inside an asp:UpdatePanel. So based on stuff
I saw about dealing with UpdatePanel's, I'm using the following to
wire up everything:
<script type="text/javascript">
var $j = jQuery.noConflict();
function pageLoad() {
$j(".lvTable th")
.draggable({zIndex:10, helper:"clone"})
.droppable({accept:".lvTable th", drop:function(ev,ui) {
__doPostBack(this.parentNode.parentNode.parentNode.id,
"reorder:" + $j(ui.draggable).attr("id") + ":" +
this.id);
}});
}
</script>
Any ideas anyone?
Thanks.