User Name Password Register
DaniWeb IT Discussion Community
Home
Forums
Tutorials
Code Snippets
Blogs
Link Directory
All
•
•
•
•
What is DaniWeb IT Discussion Community?
You're currently browsing the JavaScript / DHTML / AJAX section within the Web Development category of DaniWeb, a massive community of 375,244 software developers, web developers, Internet marketers, and tech gurus who are all enthusiastic about making contacts, networking, and learning from each other. In fact, there are 2,282 IT professionals currently interacting right now! Registration is free, only takes a minute and lets you enjoy all of the interactive features of the site.
Join our community!
Please support our JavaScript / DHTML / AJAX advertiser: Lunarpages Web Hosting
Views: 2163 | Replies: 8
Reply
•
•
Join Date: Dec 2004
Posts: 402
Reputation: Sulley's Boo will become famous soon enough Sulley's Boo will become famous soon enough 
Rep Power: 5
Solved Threads: 9
Sulley's Boo's Avatar
Sulley's Boo Sulley's Boo is offline Offline
Posting Pro in Training

Question Javascript - Print Date in different color

  #1  
May 26th, 2006
How can i display the dates that i have in my table in a different color if they were less than today's date?


..
Last edited by tgreer : May 26th, 2006 at 4:26 pm.
AddThis Social Bookmark Button
Reply With Quote  
•
•
Join Date: Dec 2004
Posts: 1,589
Reputation: tgreer is an unknown quantity at this point 
Rep Power: 7
Solved Threads: 34
Colleague
tgreer tgreer is offline Offline
Made Her Cry

Re: Javascript - Print Date in different color

  #2  
May 26th, 2006
Since this is a JavaScript question, I assume you want this done completely client-side? We'll be happy to help, but first a couple of observations:

1) This might be easier server-side. How are you generating your pages?

2) The approach will depend on your page structure and doctype. Can you give us a skeleton sample of your HTML?
Reply With Quote  
•
•
Join Date: Aug 2005
Posts: 4,596
Reputation: iamthwee is a jewel in the rough iamthwee is a jewel in the rough iamthwee is a jewel in the rough iamthwee is a jewel in the rough 
Rep Power: 15
Solved Threads: 294
iamthwee's Avatar
iamthwee iamthwee is offline Offline
Industrious Poster

Re: Javascript - Print Date in different color

  #3  
May 26th, 2006
Perhaps this
Member of: F-ugly code club

Join today don't delay!
Reply With Quote  
•
•
Join Date: Dec 2004
Posts: 1,589
Reputation: tgreer is an unknown quantity at this point 
Rep Power: 7
Solved Threads: 34
Colleague
tgreer tgreer is offline Offline
Made Her Cry

Re: Javascript - Print Date in different color

  #4  
May 26th, 2006
The Date Object would indeed come into play, but the bigger question is how he'll access the "dates" that are in his table. There needs to be a corresponding Date Object for those, or a method to access those via the DOM and move them into a Date Object, before any comparsion could be done.

That's why I pointed toward the server-side solution. My guess is that this is a dynamic, program-generated page, and as such, rather than load the page with JavaScript Date Objects to do client-side, after-the-fact date recognition, he should simply do it server-side while building the page.
Reply With Quote  
•
•
Join Date: Dec 2004
Posts: 402
Reputation: Sulley's Boo will become famous soon enough Sulley's Boo will become famous soon enough 
Rep Power: 5
Solved Threads: 9
Sulley's Boo's Avatar
Sulley's Boo Sulley's Boo is offline Offline
Posting Pro in Training

Help awww .. thanks ..

  #5  
May 26th, 2006
omg O_o hard Qs ..

How am i generating the data? ..

Its all dummy data that i typed directly in the table .. but later on IT ppl will load data to it i dont know how .. :o

and I am working on my own machine no client no server no nothing ..

ahh ..

but anyway can you give me the server side one? I think they want that one ..

and yea you asked for the html skeleton ..

here you go .. this needs to be changed its not the final thing ..

[html]

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>Flight Information System</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">


<style type="text/css">
<!--
body {
background-color: #F2F7FF;
}
body,td,th {
font-family: Verdana;
font-size: 9px;
}
-->
</style></head>

<body>
<table width="491" border="0" align="center">
<tr>
<td><img src="bright_banner.jpg" width="725" height="85"/></td>
</tr>
</table>
<table width="728" border="0" align="center">
<tr class="titles">
<td width="191" height="30"><table width="191" border="0">
<tr>
<td width="185"><div align="left"><span class="titles"><strong>Exp. Period</strong>: 25.04.00 - 25.04.08</span></div></td>
</tr>
</table></td>
<td><div align="center" class="style7"></div>
<table width="502" border="0" align="center">
<tr>
<td width="496"><div align="center"><strong>Flight Information System / </strong><strong>Record of Airline Aircraft Report</strong></div> </td>
</tr>
</table> </td>
</tr>
</table>
<table width="723" border="0" align="center" cellspacing="1">
<thead>
<tr class="head1">

<th colspan="4">Airline - Aircraft</th>
<th colspan="3">Certificate Validity</th>
<th colspan="4">Insurance Validity</th>
<th colspan="4">Add Title</th>
</tr>

<tr class="header">
<td width="26">Code</td>
<td width="114">Name</th>
<td width="28">Air</td>
<td width="34">Reg. No</td>
<td width="48">A.O.C</td>
<td width="48">C.O.F.R</td>
<td width="48">C.O.F.A</td>
<td width="48">HULL</td>
<td width="48">Third Party</td>
<td width="48">PAX</td>
<td width="48">CGO</td>
<td width="31">LOAD</td>
<td width="31">ACAS</td>
<td width="33">TCAS (V7)</td>
<td width="44">Total Aircrafts</td>
</tr>
</thead>

<tbody>
<tr>
<td>00</td>
<td>TAV Aviation Joint Stock</td>
<td>HS125</td>
<td>TCTAV</td>
<td>&nbsp;</td>
<td>05/01/2007</td>
<td>&nbsp;</td>
<td>31/10/2006</td>
<td>31/10/2006</td>
<td>31/10/2006</td>
<td>31/10/2006</td>
<td>PAX</td>
<td>YES</td>
<td>NO</td>
<td>1</td>
</tr>
<tr>
<td>000</td>
<td>Salem Aviation Jeddah</td>
<td>AN12</td>
<td>11036</td>
<td>01/06/2006</td>
<td>01/07/2006</td>
<td>01/08/2006</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>PAX</td>
<td>NO</td>
<td>YES</td>
<td>1</td>
</tr>
<tr>
<td>AAP</td>
<td>Aerovista Airlines</td>
<td>AN24</td>
<td>EX004</td>
<td>15/08/2006</td>
<td>18/12/2006</td>
<td>&nbsp;</td>
<td>30/04/2006</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>PAX</td>
<td>YES</td>
<td>NO</td>
<td>1</td>
</tr>
<tr>
<td>AIN</td>
<td>African International Airways</td>
<td>DC8</td>
<td>ZSOSI</td>
<td>20/12/2006</td>
<td>10/04/2007</td>
<td>&nbsp;</td>
<td>01/04/2007</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>CGO</td>
<td>YES</td>
<td>NO</td>
<td>1</td>
</tr>
<tr>
<td>ATG</td>
<td>Aerotrans Airlines</td>
<td>T154</td>
<td>85569</td>
<td>20/11/2007</td>
<td>10/04/2006</td>
<td>&nbsp;</td>
<td>21/06/2006</td>
<td>21/06/2006</td>
<td>21/06/2006</td>
<td>21/06/2006</td>
<td>PAX</td>
<td>YES</td>
<td>NO</td>
<td>1</td>
</tr>
<tr>
<td>AZQ</td>
<td>Silk Way Airlines</td>
<td>IL76</td>
<td>4KAZ41</td>
<td>08/03/2007</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>CGO</td>
<td>YES</td>
<td>NO</td>
<td>1</td>
</tr>
<tr>
<td>AZV</td>
<td>ASOV - AVIA, Air Company</td>
<td>IL76</td>
<td>URZVC</td>
<td>16/02/2008</td>
<td>16/02/2008</td>
<td>&nbsp;</td>
<td>17/06/2006</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>CGO</td>
<td>YES</td>
<td>NO</td>
<td>1</td>
</tr>
<tr>
<td>BDS</td>
<td>South Asia Airlines Limited</td>
<td>B707</td>
<td>S2ADU</td>
<td>15/02/2006</td>
<td>&nbsp;</td>
<td>15/07/2006</td>
<td>01/09/2006</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>CGO</td>
<td>YES</td>
<td>NO</td>
<td>1</td>
</tr>

</tbody>
</table>
<p>&nbsp;</p>
<table width="435" border="0" align="left">
<tr>
<td width="44" class="titles">Date:</td>
<td width="381">&nbsp;</td>
</tr>
<tr>
<td class="titles">Time:</td>
<td>&nbsp;</td>
</tr>
<tr>
<td class="titles">Page:</td>
<td>&nbsp;</td>
</tr>
<tr>
<td colspan="2"><div align="right"><A HREF="javascript:window.print()" class="titles">Print Page</A></div></td>
</tr>
</table>
<p align="left">&nbsp;</p>

</body>
</html>


[/html]


:!:
Reply With Quote  
•
•
Join Date: Dec 2004
Posts: 402
Reputation: Sulley's Boo will become famous soon enough Sulley's Boo will become famous soon enough 
Rep Power: 5
Solved Threads: 9
Sulley's Boo's Avatar
Sulley's Boo Sulley's Boo is offline Offline
Posting Pro in Training

Help Re: Javascript - Print Date in different color

  #6  
May 26th, 2006
•
•
•
•
Originally Posted by iamthwee
Perhaps this


you know, i thought that your signature was your reply to my Q .. i was like COMPLETY LOST .. haha ..

Thanks for the link .. Will try to understand it .. You know I know nothing about Javascript ..
Reply With Quote  
•
•
Join Date: Dec 2004
Posts: 402
Reputation: Sulley's Boo will become famous soon enough Sulley's Boo will become famous soon enough 
Rep Power: 5
Solved Threads: 9
Sulley's Boo's Avatar
Sulley's Boo Sulley's Boo is offline Offline
Posting Pro in Training

Re: Javascript - Print Date in different color

  #7  
May 27th, 2006
Is that code fine? I mean the doctype and all that :o
Reply With Quote  
•
•
Join Date: Dec 2004
Posts: 1,589
Reputation: tgreer is an unknown quantity at this point 
Rep Power: 7
Solved Threads: 34
Colleague
tgreer tgreer is offline Offline
Made Her Cry

Re: Javascript - Print Date in different color

  #8  
May 27th, 2006
Looks good. You can validate it against w3c.org's validators, to be sure.

Ok, the short answer is that you use CSS to style HTML elements. You could create two CSS classes, one for normal color, and one for "old" dates.

Help with Code Tags 
<style type="text/css">
.normal
{
  color: black;
}

.old
{
  color: red;
}
</style>

Something like that, to use a simple example. This goes in your HEAD portion of your document.

Then, to apply the style, add the "class" attribute to your tags:

Help with Code Tags 
<td class="normal>normal</td>
<td class="old">old</td>

The trick is, how to do that programmatically? Again, I suggest server-side. There is no one solution, first you have to decide what language you're going to use, and learn the basics of that language.

I suggest PHP. Daniweb has a great PHP forum.

The basic idea is that you create CSS and HTML to control how the page looks, and then you write a PHP program to output the CSS & HTML. At the time the PHP program runs (which is as soon as a user browses to the page), it can enter the dates into the table, check the dates, and add the correct "class" to the table elements.

Daniweb in fact is a big PHP program.
Reply With Quote  
•
•
Join Date: Dec 2004
Posts: 402
Reputation: Sulley's Boo will become famous soon enough Sulley's Boo will become famous soon enough 
Rep Power: 5
Solved Threads: 9
Sulley's Boo's Avatar
Sulley's Boo Sulley's Boo is offline Offline
Posting Pro in Training

News Re: Javascript - Print Date in different color

  #9  
May 27th, 2006
Thaaaaaaaaaaaanks Tgreeeeeeer
Reply With Quote  
Reply

•
•
•
•

Only community members can participate in forum threads. You must register or log in to contribute.

Register
•
•
•
•
Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)

 

•
•
•
•
•
•
•
•
DaniWeb JavaScript / DHTML / AJAX Marketplace
•
•
•
•
Thread Tools Display Modes
Linear Mode Linear Mode

•
•
•
•
ajax asp creative design developer development firefox home howto html illustrator internet javascript microsoft msdn office photoshop print site software sql toread tutorials vista web
Similar Threads
Other Threads in the JavaScript / DHTML / AJAX Forum

Advertising Opportunities on DaniWeb
Contact Us - Newsletter Archive - Sitemap - Privacy Statement
All times are GMT -4. The time now is 4:35 am.
Forum system based on vBulletin Copyright ©2000 - 2008, Jelsoft Enterprises Ltd.
©2003 - 2008 DaniWeb® LLC