Question

我有两组代码Loadmore Button和Jqueury Drag N Drop，但它们并不是一样的。

如何将它们合并为一个代码？

以下是问题：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"
type="text/javascript">

Loadmore按钮需要此行并杀死拖放元素的UI功能。

拖动N Drop：

<title>jQuery Dynamic Drag'n Drop</title>
<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(){ 

$(function() {
    $("#contentLeft ul").sortable({ opacity: 0.6, cursor: 'move', update: function() {
        var order = $(this).sortable("serialize") + '&action=updateRecordsListings'; 
        $.post("updateDB.php", order, function(theResponse){
            $("#contentRight").html(theResponse);
        });                                                              
    }                                 
    });
});

}); 
</script>

DND updateDB.php

<?php 
require("db.php");

    $action                 = mysql_real_escape_string($_POST['action']); 
    $updateRecordsArray     = $_POST['recordsArray'];

if ($action == "updateRecordsListings"){

$listingCounter = 1;
foreach ($updateRecordsArray as $recordIDValue) {

    $query = "UPDATE records SET recordListingID = " . $listingCounter . " WHERE recordID = " . $recordIDValue;
    mysql_query($query) or die('Error, insert query failed');
    $listingCounter = $listingCounter + 1;  
}

echo '<pre>';
print_r($updateRecordsArray);
echo '</pre>';
echo 'If you refresh the page, you will see that records will stay just as you modified.';
}?>

DND主要PHP：

    <ul>
    <?php
            $query  = "SELECT * FROM records ORDER BY recordListingID ASC";
            $result = mysql_query($query);

            while($row = mysql_fetch_array($result, MYSQL_ASSOC))
            {
            ?>
                <li id="recordsArray_<?php echo $row['recordID']; ?>"><?php echo $row['recordID'] . ". " . $row['recordText']; ?></li>
            <?php } ?>
        </ul>

Loadmore：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"
type="text/javascript"></script>

<script>
$(function() {
var page = 1;
$("#LoadMore").click(function(){
    $.ajax({
        type:"GET",
        url:"page4.php",
        data:{page:page},
        success: function(response) {
            $("#data_grid").append(response); 
            page++;
        }
    });
}); 
});</script>

Loadmore page4.php

<?php
//set argument as your mysql server
$connect = mysql_connect("mysql_server","mysql_user","mysql_password");
mysql_select_db("database_name",$connect);

$page = isset($_GET["page"]) ? $_GET["page"] : 1;
$limit = 25;
$offset = ($page - 1) * $limit;

$sql = "SELECT * FROM table2 limit $offset, $limit";
$result = mysql_query($sql);
$numRows = mysql_num_rows($result);
if($numRows>0) {
    while($row = mysql_fetch_array($result)) {
        //get field data and set to the following row
        echo "<tr><td>field 1</td><td>field 2</td><td>field 3</td></tr>";
                //edit row as you table data

    }
} else {
    echo "<tr><td colspan='3'> No more data </td></tr>";
}
exit;
?>

我错过了什么？我能解决这个问题吗？我是否要废弃Jquery Drag N Drop？有没有我应该使用的替代方案？

背景：用户将按照他们认为合适的顺序对列出的项目进行评级。总可能的项目超过300,000，但用户可能只使用前几百个，其余的用作可搜索的数据库，以将奇数项目添加到列表中。我可以将有问题的2个代码分开工作，但是当我尝试组合时会产生冲突。

感谢您抽出时间协助这个项目。

Answer 1

看这里

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"
    type="text/javascript">

和

<script type="text/javascript" src="jquery-1.3.2.min.js"></script>

是相同的（jQuery文件）

所以只使用一个

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"
    type="text/javascript">

如何使用jQuery Drag and Drop排名修复Ajax冲突？

1 个答案: