2013-10-28 39 views
1

我是PHP,JavaScript和JQuery的新手。只是認爲這將是一個有趣的建立一個足球記分牌。所以在做了一些研究之後,我提出了這個問題。我確信有更好的辦法,但我剛從本網站的很多文章中借鑑了一些想法。我遇到了與Gridster的障礙。我相信它是用我的桌位正確寫入cookie。我已將表格放入列出的項目中,因爲在定義爲widget_selector時無法使表格工作。Cookie中的Gridster閱讀位置

這是我的代碼。爲了讀取cookie的位置數據並相應地訂購我的表格,我需要做什麼?非常感謝您的幫助!

<html> 
<head> 
<link rel="stylesheet" type="text/css" href="assets/css/jquery.gridster.css"> 
<link rel="stylesheet" type="text/css" href="assets/css/styles.css"> 
<title>Scores</title> 

</head> 
<body> 

<script type="text/javascript" src="assets/jquery.js"></script> 
<script type="text/javascript" src="assets/jquery.gridster.js" charster="utf-8"></script> 
<script type="text/javascript" src="assets/jquery.cookie.js"></script> 
<script type="text/javascript"> 
var gridster; 

$(function() { 
gridster = $(".gridster ul").gridster({ 
widget_margins: [5, 5], 
widget_base_dimensions: [140, 110], 
min_cols: 2, 
max_cols: 10, 
serialize_params: function($w, wgd) { 
    return { 
    id: wgd.el[0].id, 
    col: wgd.col, 
    row: wgd.row, 
    size_y: wgd.size_y, 
    size_x: wgd.size_x   
    } 
}, 
draggable: { 
    stop: function(event, ui) { 
    var positions = JSON.stringify(gridster.serialize()); 
    console.log(positions); 
    $.cookie("grid-data", positions, { expires : 7 }); 
    } 
} 
}).data('gridster');  
}); 
</script> 

<?php 
//this array contains sports and their URLs 
$sports = array( 
"NFL" => "http://wu.apple.com/nfl/bottomline/xml/scores",); 

// load logo files 
$nfllogoxml = simplexml_load_file('nfllogo.xml'); 

foreach ($sports as $sport => $url) { 
//get the page pointed to by $url 
$simplexml = simplexml_load_file($url); 
echo "<h2>".$sport."</h2>"; 
echo "<div id='gamescores' class='gridster'>"; 
echo "<ul>"; 
// If game is in progress, change URL given by feed to point to boxscore 
foreach ($simplexml->GAME as $game){ 

    echo "<li id='".$game->GAMEID."' data-row='1' data-col='1' data-sizex='2' data-sizey='1'>"; 

    if ($game->STATUSID == 2 || $game->STATUSID ==22 || $game->STATUSID ==23){ 
     $boxurl = preg_replace("/scoring/", "boxscore", $game->URL); 
     echo "<table id='".$game->GAMEID."' cols='4' style='background-color:#CCF5CC' ondblclick=\"this.className='tableclick';window.location='".$boxurl."'\">"; 
    } 
    elseif ($game->STATUSID == 7){ 
     echo "<table id='".$game->GAMEID."' cols='4' style='background-color:#CCF5CC' ondblclick=\"this.className='tableclick';window.location='".$boxurl."'\">"; 
    } 
    elseif ($game->STATUSID == 3){ 
     echo "<table id='".$game->GAMEID."' cols='4' style='background-color:#BCBCCA' ondblclick=\"this.className='tableclick';window.location='".$game->URL."'\">"; 
    } 
    else { 
     echo "<table id='".$game->GAMEID."' cols='4' ondblclick=\"this.className='tableclick';window.location='".$game->URL."'\">"; 
     } 
    echo "<col width='30'>"; 
    echo "<col width='180'>"; 
    echo "<col width='30'>"; 
    echo "<col width='60'>"; 
    echo "<th colspan='3' align='center'>"; 
    echo "<b>Matchup #".$game->attributes()->count."</b>"; 
    echo "</th>"; 
    echo "<th align='right'><b>Bets</b></th>"; 
    echo "<tr>"; 
    if (strpos($sport,'NFL') !==false){ 
     $gamestatus=$game->STATUSID; 
     $teamnamev=$game->AWAY->TEAM; 
     $teamnameh=$game->HOME->TEAM; 

     // Get NFL Team Icon from icon XML file stored locally 
     $iconurlv = $nfllogoxml->xpath(" /TRM/teamRecord/iconURL[../team/text() = '".$teamnamev."'] "); 
     $iconurlh = $nfllogoxml->xpath(" /TRM/teamRecord/iconURL[../team/text() = '".$teamnameh."'] "); 
     foreach ($iconurlv as $iconpathv){ 
      echo "<td><img src='".$iconpathv."' height='25' width='25'></img></td>"; 
      }     
     echo "<td>".$game->AWAY->TEAM."</td>"; 
     echo "<td>".$game->AWAY->SCORE."</td>"; 
     echo "</tr>"; 
     echo "<tr href='".$game->URL."'>"; 
     foreach ($iconurlh as $iconpathh){ 
      echo "<td><img src='".$iconpathh."' height='25' width='25'></img></td>"; 
      }    
     echo "<td>".$game->HOME->TEAM."</td>"; 
     echo "<td>".$game->HOME->SCORE."</td>"; 
     echo "</tr>"; 
     echo "<tr>"; 
     if ($game->STATUSID == 7){ 
      echo "<td colspan='3'>DELAYED</td>"; 
      } 
     elseif ($game->STATUSID == 23){ 
      echo "<td colspan='3'>HALFTIME</td>"; 
      } 
     else{ 
      echo "<td colspan='3'>".$game->STATUS."</td>"; 
      } 
     echo "</tr>";  
     echo "</table>"; 
     echo "</li>"; 

     } 
} 
     echo "</ul>"; 
     echo "</div>"; 
echo "<p class=\"clear\">"; 
} 

?> 

</body> 
</html> 

回答

2

我想通過下面的代碼做到這一點。似乎在任何人感興趣的情況下工作...

if ($.cookie("grid-data") !== null) { 
    var scorepos = JSON.parse($.cookie("grid-data")); 
} 

for (var i = 0; i < scorepos.length; i++){ 
    var position = scorepos[i]; 
    var list = document.getElementsByTagName("ul")[0] 
    list.getElementsByTagName("li")[i].setAttribute("data-row",position.row); 
    list.getElementsByTagName("li")[i].setAttribute("data-col",position.col); 
}