jQuery multi-level sortable list IE Problem
Good afternoon Stackoverflow,
Today I got f'd by IE as usual when using the jQuery library with Ajax.
So whats my problem, well take a look at my live demo: http://194.247.30.66/~keizer/iemakesmesad/
Try ordening the items in FF / Chrome, then test it in IE and we'll all facepalm because of Bill Gates.
Possible explanation: IE grabs the whole ul instead of the ul inside the ul.. any solution?
Code of index.php
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
<script type="text/javascript">
// When the document is ready set up our sortable with it's inherant function(s)
$(document).ready(function() {
<?php
include_once("../ond/inc/php/connect.php");
$i = 0;
$result = mysql_query("SELECT * FROM paginas WHERE type='0' ORDER BY id ASC");
while($row = mysql_fetch_array($result))
{
$i++;
$result2 = mysql_query("SELECT * FROM paginas WHERE type=".$row{"id"}." ORDER BY id ASC LIMIT 1");
while($row2 = mysql_fetch_array($result2))
{
echo ' $("#submenu_list'.$i.'").sortable({
handle : \'.handle\',
update : function () {
var order = $(\'#submenu_list'.$i.'\').sortable(\'serialize\');
$("#info").load("process-sortable.php?"+order);
}
});
';
}
}
?>
$("#menu_list").sortable({
handle : '.handle',
update : function () {
var order = $('#menu_list').sortable('serialize');
$("#info").load("process-sortable.php?"+order);
}
});
});
</script>
</head>
<body>
<?php
$result = mysql_query("SELECT * FROM paginas_test WHERE type='0' ORDER BY position ASC");
echo '<table cellspacing="2" cellpadding="2">';
echo ' <tr>';
echo ' <th colspan="2" scope="col"><img src="../ond/inc/afb/report.png" />Volgordebepaling</th>';
echo ' </tr>';
echo '</table>';
echo '<ul id="menu_list">';
$i = 0;
while ($row = mysql_fetch_array($result))
{
$i++;
echo '<li style="list-style:none;" id="listItem_'.$row{"id"}.'">';
echo ' <img src="../testajax/arrow.png" alt="move" width="16" height="16" class="handle" /> '.$row{"titel"}.'<br />';
#mysql_query("SELECT * FROM paginas WHERE type='0' ORDER BY id ASC");
$result2 = mysql_query("SELECT * FROM paginas_test WHERE type=".$row{"id"}." ORDER BY position ASC");
echo '<ul id="submenu_list'.$i.'">';
while($row2 = mysql_fetch_array($result2))
{
echo '<li style="list-style:none;margin-left:15px;" id="sublistItem_'.$row2{"id"}.'">';
echo '<img src="../testajax/arrow.png" alt="move" width="16" height="16" class="handle" /> '.$row2{"titel"}.'<br />';
echo '</li>';
}
echo '</ul></li>';
}
echo '</ul>';
echo '<div id="info"></div>';
?>
</body>
</html>
Code of process-sortable.php:
<?php
include("../ond/inc/php/connect.php");
if(isset($_GET['listItem']))
{
foreach ($_GET['listItem'] as $position => $item)
{
$sql = "UPDATE `paginas_test` SET `position` 开发者_如何学C= $position WHERE `id` = $item";
mysql_query($sql);
}
}
if(isset($_GET['sublistItem']))
{
foreach ($_GET['sublistItem'] as $position2 => $item2)
{
$sql = "UPDATE `paginas_test` SET `position` = $position2 WHERE `id` = $item2";
mysql_query($sql);
}
}
print_r ($sql);
?>
check this one: jQuery unexpected sortable behaviour
加载中,请稍侯......
精彩评论