Sortable Causes IE 6 and 7 to crash
*sigh* This problem is driving me absolutely crazy.
When I try to drag an object in my sortable UI, IE crashes completely.
In Firefox, the UI works as intended.
This sortable UI uses AJAX to update a MySQL table with the new order
when a user moves stuff around.
Here's a demo of what I'm trying to do here: http://www.digi-adopt.com/sortdemo.php
Here's the script and CSS part:
<head>
<script type="text/javascript" src="jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="jquery-ui-1.7.1.custom.min.js"></
script>
<script type="text/javascript">
$(document).ready(
function() {
$("#sortme").sortable({
update : function () {
serial = $("#sortme").sortable("serialize");
$.ajax({
url: "sort2.php",
type: "post",
data: serial,
error: function(){
alert("theres an error with AJAX");
}
});
}
});
}
);
</script>
<link type="text/css" href="jquery-ui-1.7.1.custom.css"
rel="Stylesheet" />
<style type="text/css">
#sortme{ list-style-type: none; margin: 0; padding: 0; }
#sortme li { float: left; width: 150px; height: 200px; text-align:
center; margin: 50px 40px 0 0; padding: 1px; }
.clearboth { clear: all; }
</style>
</head>';
Here is the sortable list:
<table onselectstart="return false;" style="-moz-user-select: none;"
width=800>
<ul id="sortme">';
$query = "SELECT sort FROM `users` WHERE `username` = '".$luser."'";
$result= mysql_query($query);
if(mysql_num_rows($result) != 0)
{
list($sort) = mysql_fetch_row($result);
}
if ($sort == null){
$result = mysql_query("SELECT * FROM owned_adoptables WHERE owner =
'$username' ORDER BY uid DESC");
while($row = mysql_fetch_array($result)) {
$article_content=$article_content."<li id='menu_. $row[id] .'><img
src='$row[imageurl]' />
$row[name]</li>";
}
And, finally, here's the page that AJAX uses to update the database:
<?php
include("inc/functions.php");
include("inc/config.php");
include("inc/settings.php");
// Connect to our database
$conn = mysql_connect($dbhost, $dbuser, $dbpass) or die ('Error
connecting to mysql database!');
mysql_select_db($dbname);
$sort= $_POST['menu'];
for ($i = 0; $i < count($sort); $i++) {
mysql_query("UPDATE `owned_adoptables` SET `sort`='".$i."' WHERE
`uid`='".$sort[$i]."'");
}
?>
I've...
1. Disabled text selection
2. Ensured that I only selected sortable/draggable options for build
3. Tested it with other folks who use IE
I'm stuck :(