Print Page | Close Window

Displaying images in place of numbers for dates?

Printed From: Web Wiz Forums
Category: General Discussion
Forum Name: ASP.NET Discussion
Forum Description: Discussion and chat on ASP.NET related topics.
URL: https://forums.webwiz.net/forum_posts.asp?TID=21207
Printed Date: 28 March 2026 at 9:37am
Software Version: Web Wiz Forums 12.08 - https://www.webwizforums.com


Topic: Displaying images in place of numbers for dates?
Posted By: imhotep
Subject: Displaying images in place of numbers for dates?
Date Posted: 03 September 2006 at 6:24pm
I was looking at a site that was created in coldfusion http://www.warehouselive.com/index.cfm?fuseaction=pubCalendar - http://www.warehouselive.com/index....ion=pubCalendar

I don't think this is manually done, but is information displayed from a database. Looking on the left-hand side of the page, you can see on this calendar the dates are custom images. I wanted to know if this was possible in asp.net and if so, how can one accomplish this visual style? Any help would be appreciated.


-------------
Man Know Thyself


Replies:
Posted By: michael
Date Posted: 03 September 2006 at 8:14pm
Very simple actually. You can use something like 

Private Sub Foo()

        imageDay.ImageUrl = "~/images/" & Date.Now.Day.ToString & ".jpg"

imageMonth.ImageUrl = "~/images/" & Date.Now.Month.ToString & ".jpg"

imageWeekday.ImageUrl = "~/images/" & Date.Now.DayOfWeek.ToString & ".jpg"



End Sub


You then just need to hook up some css to make it look like one image i.e. removing borders etc.

-------------
http://baumannphoto.com" rel="nofollow - Blog | http://mpgtracker.com" rel="nofollow - MPG Tracker

Posted By: imhotep
Date Posted: 03 September 2006 at 9:19pm
Would this script work for dates from a database, or just the current date reading from the server? I want the images to reflect the dates for future events in the database and not the current date. 

-------------
Man Know Thyself

Posted By: imhotep
Date Posted: 03 September 2006 at 9:43pm
I found a javascript version but it only displays the current date, not one from a database. How could I change this to work with asp.net, dates from a database, and what code (as well as where I should put it) should I use?


Quote <HEAD>

<SCRIPT LANGUAGE="JavaScript">
<!-- Original:  Jeff Harding (jbh@site-ations.com) -->
<!-- Web Site:  http://www.site-ations.com -->

<!-- Day images (c): http://www.site-ations.com -->
<!-- Month images (c): http://www.bruce-hamilton.com -->

<!-- This script and many more are available free online at -->
<!-- The JavaScript Source!! http://javascript.internet.com -->

<!-- Begin
theDate= new Date();
months = new Array();
days = new Array();
months[1] ="jan.gif";
months[2] ="feb.gif";
months[3] ="mar.gif";
months[4] ="apr.gif";
months[5] ="may.gif";
months[6] ="jun.gif";
months[7] ="jul.gif";
months[8] ="aug.gif";
months[9] ="sep.gif";
months[10] ="oct.gif";
months[11] ="nov.gif";
months[12] ="dec.gif";
days[1] ="1st.gif";
days[2] ="2nd.gif";
days[3] ="3rd.gif";
days[4] ="4th.gif";
days[5] ="5th.gif";
days[6] ="6th.gif";
days[7] ="7th.gif";
days[8] ="8th.gif";
days[9] ="9th.gif";
days[10] ="10th.gif";
days[11] ="11th.gif";
days[12] ="12th.gif";
days[13] ="13th.gif";
days[14] ="14th.gif";
days[15] ="15th.gif";
days[16] ="16th.gif";
days[17] ="17th.gif";
days[18] ="18th.gif";
days[19] ="18th.gif";
days[20] ="20th.gif";
days[21] ="21st.gif";
days[22] ="22nd.gif";
days[23] ="23rd.gif";
days[24] ="24th.gif";
days[25] ="25th.gif";
days[26] ="26th.gif";
days[27] ="27th.gif";
days[28] ="28th.gif";
days[29] ="29th.gif";
days[30] ="30th.gif";
days[31] ="31st.gif";
function printDate() {
document.write('<img src="' + months[theDate.getMonth()+1] + '">'); // month
document.write('<br>');
document.write('<img src="' + days[theDate.getDate()] + '">'); // day
}
//  End -->
</script>
</HEAD>

<!-- STEP TWO: Copy this code into the BODY of your HTML document  -->

<BODY>

<center>

<script>
printDate();
</script>

<p>
<font face="arial, helvetica" size="-2">
Day images   (c) <a href="http://www.site-ations.com">http://www.site-ations.com</a><br>
Month images (c) <a href="http://www.bruce-hamilton.com">http://www.bruce-hamilton.com</a>
</font>

</center>

<!-- STEP THREE:  Download the images and upload them to your server -->
<!-- http://javascript.internet.com/img/date-images/date-images.zip -->

<p><center>
<font face="arial, helvetica" size="-2">Free JavaScripts provided<br>
by <a href="http://javascriptsource.com">The JavaScript Source</a></font>
</center><p>

<!-- Script Size:  2.28 KB -->


-------------
Man Know Thyself

Posted By: michael
Date Posted: 04 September 2006 at 3:28am
form a database you can simply use something like:
imageDay.ImageUrl = "~/images/" & Datepart("d",myDatareader(0)) & ".jpg"

assuming you are using a datareader and the date ist index 0



-------------
http://baumannphoto.com" rel="nofollow - Blog | http://mpgtracker.com" rel="nofollow - MPG Tracker

Posted By: imhotep
Date Posted: 07 September 2006 at 1:25am
Okay, I am kind of new to this. Is the process similar to the example I posted above using the JavaScript?

Do I need to declare the array just like they do? Where would I do that in the asp.net page? VB is the script.

Normally when displaying an image from a database, the code is something like:

<img src="../../image_uploads/<%# dsData_Set_Title.FieldValue("Field_with_image", Container) %>" width="400">

So how would I work the example given in your example?


-------------
Man Know Thyself

Posted By: michael
Date Posted: 07 September 2006 at 2:26pm
Why do you want to do an array? just name the images monday.jpg, tuesday.jpg etc. 1.jpg, 2.jpg etc. and do it the way I showed. No need to make it more complicated than it has to be. You can register a client script block with the script you got or just transfer it over to vb.net but like I said, it is not necessary just read the date from the database and take it apart with date functions.

-------------
http://baumannphoto.com" rel="nofollow - Blog | http://mpgtracker.com" rel="nofollow - MPG Tracker

Posted By: imhotep
Date Posted: 09 September 2006 at 3:49am
I'm only going off the example in the JavaScript version that doesn't apply to the database. Remember I'm new, so I don't know the particular order of operations for this particular procedure. So I am trying to get the steps down so I can properly understand what I'm doing. Hoping you can give an example if that's not too much? From there, I can pretty much get and take it further. 

-------------
Man Know Thyself

Posted By: michael
Date Posted: 09 September 2006 at 4:32pm
Dim con as new SQLConnection("your connection string")
Dim cmd as new SQLComannd("Select * from yourtable",con)
Dim dr as SQLDataReader
con.Open
Using con
dr=cmd.ExecuteReader
While dr.Read
   Dim imgDay, imgWeekDay, imgMonth as new image
   imgDay.imageURL="/images/" & DatePart("d",dr("datefield")) & ".jpg"
    imgMonth.imageURL="/images/" & Datepart("m",dr("datefield")) & ".jpg"
    imgWeekDay.imageURL="/images/" & CDate(dr("datefield").Weekdayname 'look that up not sure if its the right property
End While
End Using

Make sure you give them the right formatting of course, this will just display all the images, if you got them.

-------------
http://baumannphoto.com" rel="nofollow - Blog | http://mpgtracker.com" rel="nofollow - MPG Tracker


Print Page | Close Window

Forum Software by Web Wiz Forums® version 12.08 - https://www.webwizforums.com
Copyright ©2001-2026 Web Wiz Ltd. - https://www.webwiz.net