更新不会在“.sortable”列表上工作

时间:2011-12-15 19:48:14

标签: javascript jquery drag-and-drop jquery-ui-sortable

我正在尝试在我的wordpress网站上使用Jquery“可排序”列表,但出于某种原因,虽然它是可排序的,但它似乎没有运行更新功能!

以下是我正在使用的代码:

标题代码:

<script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/js/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/js/jquery-ui-1.7.1.custom.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
  $("#test-list").sortable({
    handle : '.handle',
    update : function () {
       var homepageorder = $('#test-list').sortable('serialize');
      $("#testinfo").load("process-sortable.php?"+homepageorder);
    }
  });
});
</script>

正文代码:

<pre>
<div id="testinfo">Waiting for update</div>
</pre>
<ul id="test-list">

<?php
$dbhost                         = "**********";
$dbuser                         = "**********";
$dbpass                         = "**********";
$dbname                         = "**********";

$con = mysql_connect($dbhost, $dbuser, $dbpass) or die ("Error connecting to mysql");

mysql_select_db("arcadetheme1", $con);

$result = mysql_query("SELECT * FROM homepageorder ORDER BY position") or die(mysql_error());;

while($row = mysql_fetch_array($result))
{
  echo '<li id="listItem_'.$row['id'].'"><img src="http://localhost/new-arcade-theme-one/wp-content/themes/fungames/images/arrow.png" alt="move" width="16" height="16" class="handle" /><strong>Item '.$row['id'].'</strong></li>';
}

mysql_close($con);


?> 
</ul>

过程可排序:

$dbhost                         = "**********";
$dbuser                         = "**********";
$dbpass                         = "**********";
$dbname                         = "**********";

$conn = mysql_connect($dbhost, $dbuser, $dbpass) or die ("Error connecting to mysql");
mysql_select_db($dbname);

foreach ($_GET['listItem'] as $position => $item) :
$query = "UPDATE `homepageorder` SET `position` = $position WHERE `id` = $item";
mysql_query($query) or die('Error, insert query failed');
$sql[] = "UPDATE `homepageorder` SET `position` = $position WHERE `id` = $item";
endforeach;

print_r ($sql);

我已经尝试了这个代码并且它似乎工作得很好但是只要我将它添加到WordPress它就不会更新!

如果有人能帮助我,我会非常感激!!

1 个答案:

答案 0 :(得分:0)

尝试使用jQuery.noConflict(),因为最终代码中的jQuery版本可能存在冲突。

像这样:

<script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/js/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/js/jquery-ui-1.7.1.custom.min.js"></script>
<script type="text/javascript">

var $j = jQuery.noConflict();

$j(document).ready(function() {
  $j("#test-list").sortable({
    handle : '.handle',
    update : function () {
      var homepageorder = $j('#test-list').sortable('serialize');
      $j("#testinfo").load("process-sortable.php?"+homepageorder);
    }
  });
});
</script>

请参阅http://digwp.com/2009/06/including-jquery-in-wordpress-the-right-way/