0

好的 - 我已经弄清楚如何使用 jquery 拖放可排序 ui。我还想出了如何用我的表中的时间数据填充 jquery 列表。但是……我又碰上了另一堵砖墙。

以下是 test.php 的脚本

<?php
session_start();
// include database connection file, if connection doesn't work the include file will throw an error message
include '../schedule/include/db_connect.php';

    $date1 = "10/01/2012";
        echo $date1;

// strtotime() will convert nearly any date format into a timestamp which can be used to build a date with the date() function.
$timestamp = strtotime($date1);
$start_date = date("Y-m-d", $timestamp);

$result="SELECT DATE_FORMAT(List_Dates.DB_Date, '%m/%d/%Y') as newdate, DATE_FORMAT(List_Time.TFM_Time,'%h:%i %p') as newtime
FROM List_Dates, List_Time
WHERE DATE(DATE_FORMAT(List_Dates.DB_Date,'%Y-%m-%d')) LIKE '" . $start_date . "%'
ORDER BY List_Time.TFM_Time";

$answer = mysql_query($result);

?>
<!DOCTYPE html>
<html lang="en">
<head>
        <meta charset="utf-8">
        <title>jQuery UI Sortable - Connect lists</title>
        <link rel="stylesheet" type="text/css" href="../schedule/include/formats.css"/>
        <link rel="stylesheet" href="../jquery/themes/custom-theme/jquery.ui.all.css">
        <script src="../jquery/jquery-1.7.1.js"></script>
        <script src="../jquery/ui/jquery.ui.core.js"></script>
        <script src="../jquery/ui/jquery.ui.widget.js"></script>

        <script src="../jquery/ui/jquery.ui.mouse.js"></script>
        <script src="../jquery/ui/jquery.ui.sortable.js"></script>
        <script src="../jquery/ui/jquery.ui.selectable.js"></script>
        <style>
        #sortable1, #sortable2 { list-style-type: none; margin: 0; padding: 0 0 2.5em; float: left; margin-right: 10px; }
        #sortable1 li, #sortable2 li { margin: 0 5px 5px 5px; padding: 5px; font-size: 1.2em; width: 120px; }
        </style>
        <script>
        $(function() {
                $( "#sortable1, #sortable2" ).sortable({
                        connectWith: ".connectedSortable"
                }).disableSelection();
        });
        </script>
</head>
<body>

<div>
<ul name="timelist" id="sortable1" class="connectedSortable">
<?php
while($row = mysql_fetch_array($answer))
{
        echo "<li class='ui-state-default'>". $row['newtime'] ."</li>";
}
?>
</ul>

<ul name="blocklist" id="sortable2" class="connectedSortable">
        <li id="blocked" type="date" class="ui-state-highlight"></li>
</ul>
</div>

</body>
</html>

正如我之前提到的，该脚本成功地用我的数据库中的时间填充了一个可排序的拖放列表。我可以从左侧时间列表拖放一次到右侧阻止列表。现在我需要从阻止列表中提取一个数组。我发现了以下内容：

<script>
$('ul#myList li').each(function(){
var number = $(this).find('span:first-child').text();
var fruit = $(this).find('span:first-last').text();
});
</script>

对于我的应用程序，按如下方式更改语法是有意义的：

<script>
$('ul#sortable2 li').each(function(){
var btime = $(this).find('span:first-child').text();
});
</script>

但是......我无法弄清楚如何成功使用它并回显结果。我尝试过的一切都以失败告终。欢迎任何建议。

非常感谢 - 亭

4

1 回答 1

0

查看 jQuery UI 文档，有一个名为 toArray 的方法，您可以在可排序元素上调用该方法来获取数组。

http://jqueryui.com/demos/sortable/#method-toArray

于 2012-04-11T12:40:50.843 回答