2012-04-11 11 views
0

OK - jqueryのドラッグドロップでソート可能なUIを使用する方法を理解しました。私はまた、テーブルから時刻データをjqueryリストに取り込む方法を考え出しました。しかし...私は別のレンガの壁にぶつかっている。初心者からJavascript、jQuery、Ajax

後は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> 

ためのスクリプトです。私は左サイドタイムリーリストから右サイドブロックリストに1回ドラッグアンドドロップできます。今私はブロックリストから配列を抽出する必要があります。

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

しかし...私は正常にそれを使用する方法を見つけ出すことはできませんし、エコー:次のように構文を変更することは理にかなって私のアプリケーションのために

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

:私は、次を発見しました結果。私が試したすべてが失敗に終わります。アドバイスは大歓迎です。

おかげで多くの - パビリオン

答えて

関連する問題