javascript - Comparing dates grabbed from an API to todays date -
i'm in process of showing "fixtures" of sports team on website, data grabbed website.
i have api gets data including next opponent, date of, kick of time etc.
i'm posting each fixture list, , each element different div.
e.g. each fixture - <li><div>date of fixture</div> <div>kick off time</div> <div>home team</div> <div>away team</div></li>
i have each date in div:first on each list item, , have current date in span.
i've tried using date.js structure date given, , todays date, comparable format, , compare them against each other , show latest 1 - cannot seem more 1 list item.
i want add "hidden" class each list item before todays date.
here's i've got far:
<?php $request = "https://www.kimonolabs.com/api/csv/9shgt89o?apikey=-----"; $response = file_get_contents($request); $results = json_decode($response); $currentdate = date("d d m y"); echo "<ul>\n\n"; $f = fopen("https://www.kimonolabs.com/api/csv/9shgt89o?apikey=-----", "r"); while (($line = fgetcsv($f)) !== false) { echo "<li>"; foreach ($line $cell) { echo "<div>" . htmlspecialchars($cell) . "</div>"; } echo "</li>\n"; } fclose($f); echo "\n</ul>"; echo "<span>" . $currentdate . "</span>" ?> <!doctype html public "-//w3c//dtd xhtml 1.0 transitional//en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <link href='https://fonts.googleapis.com/css?family=open+sans' rel='stylesheet' type='text/css'> <script src="//code.jquery.com/jquery-1.12.0.min.js"></script> <script src="date.js"></script> <style> body { font-family: 'open sans', sans-serif; } .hidden { display:none; } ul li div { display:inline-block; padding:6px; } ul { list-style:none; } ul li { padding:6px; } </style> <head> <script> $(document).ready(function(){ $('ul li:nth-child(1)').addclass('hidden'); $('ul li:nth-child(2)').addclass('hidden'); $('ul li div:nth-child(7)').addclass('hidden'); $('ul li div:nth-child(8)').addclass('hidden'); $('span').addclass('date'); }); var todaytext = $('span').text(); var today = date.parse(todaytext); document.write('<p>' + today +'</p>'); $('ul li').each(function() { date.parse(this); }); var fixturetext = $('ul li:eq( div:first').text(); var fixture = date.parse(fixturetext); document.write('<p>' + fixture +'</p>'); </script> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title>untitled document</title> </head> <body> </body> </html>
i don't think i'm far off answer i'm stumbling on myself @ moment!
thanks in advance.
the things should happen multiple list items should go in loop. this:
$('ul li').each(function() { var d = date.parse(this); if( d < today ) this.hide(); });
the php statements should go in html body.
Comments
Post a Comment