CodingForums.com - Add ST/ND/RD/TH to DAY in DATE

CodingForums.com (http://www.codingforums.com/index.php)

- JavaScript programming (http://www.codingforums.com/forumdisplay.php?f=2)

- - Add ST/ND/RD/TH to DAY in DATE (http://www.codingforums.com/showthread.php?t=24871)

Add ST/ND/RD/TH to DAY in DATE

I acquired this from joh6nn a year ago and now need one small addtion. This code produces the next meeting date based on one's local PC date. For the days, I need ST, ND, RD, TH added. For example, instead of "August 29", I need it to kick out "August 29th". Possible!?

Code:

                  <table border="0" cellpadding="2" cellspacing="0" width="100%" bgcolor="#EFEFEF">

<!-- BEGIN NEXT BOOSTER CLUB AND NEXT GAME NOTICES -->

                    <tr>

                      <td width="13" valign="top"><img border="0" src="images/dot_red_anim_13x13.gif" width="13" height="13"></td>

                      <td valign="top"><span class="bold"><span class="red">Next Booster Club Meeting:</span></span><br>

<!-- SCRIPT below automatically updates the date of the next meeting based on the PC's date -->

<script>

var Schedule = new Array(12);

for ( var i = 0; i < 12; i++ ) {

    Schedule[i ] = new Array();

    }

var Games = new Array(12);

for ( var i = 0; i < 12; i++ ) {

    Games[i ] = new Array();

    }

var weekdays = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];

var months = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];



// Set the days you want

// Because the array starts with 0, 0=January, 1=February, and so on.  So, the month [7] below is one number behind the actual month number

// Schedule[month-1][day] = ["first message" , "second message"];

// Schedule[7][20] = ["7:00PM" , "THIS IS THE TOPIC TEXT"];  --- see original script in another file...shows where "topic" line is added, etc.

Schedule[7][19] = ["7:00pm" , ""]; // AUGUST

Schedule[7][26] = ["7:00pm" , ""];

Games[7][29] = ["7:30pm", "Leander (@ Leander)"]; // Season Opener

Schedule[8][2] = ["7:00pm" , ""]; // SEPTEMBER

Schedule[8][9] = ["7:00pm" , ""];

Games[8][12] = ["7:30pm" , "Westwood (@ Burger Center)"];

Schedule[8][16] = ["7:00pm" , ""];

Games[8][19] = ["7:30pm" , "McNeil (@ Round Rock)"];

Schedule[8][23] = ["7:00pm" , ""];

Games[8][26] = ["7:30pm" , "Hays (@ Burger Center)"];

Schedule[8][30] = ["7:00pm" , ""];

Games[9][3] = ["7:30pm" , "S F Austin (@ House Park)"]; // OCTOBER

Schedule[9][7] = ["7:00pm" , ""];

Games[9][9] = ["7:00pm" , "Westlake (@ Burger Center)"];

Schedule[9][14] = ["7:00pm" , ""];

Games[9][17] = ["7:30pm" , "Seguin (@ Seguin)"];

Schedule[9][21] = ["7:00pm" , ""];

Games[9][23] = ["7:00pm" , "Akins (@ Burger Center)"];

Schedule[9][28] = ["7:00pm" , ""];

Games[9][30] = ["7:00pm" , "San Marcos (@ Burger Center)"];

Schedule[10][4] = ["7:00pm" , ""]; // NOVEMBER

Games[10][7] = ["7:30pm" , "Crockett (@ Burger Center)"];

Schedule[10][11] = ["7:00pm" , ""];

// ADD MORE MEETINGS AND-OR PLAYOFF EVENTS HERE .... WHAT YOU SEE IS FROM 2002 RIGHT NOW

// Games[10][16] = ["1:00pm" , "Judson (@ Hays Stadium)"];

// Schedule[10][18] = ["7:00pm" , ""];

// Schedule[10][25] = ["7:00pm" , ""];



function dateWriter() {

    var today, then, start;

    today = new Date();

    if ( Schedule[today.getMonth()][today.getDate()] ) {// only true if you explicitly set it 

    return ("Today at " + Schedule[today.getMonth()][today.getDate()][0] + '.'); 

    }

    else {

        for (var m = today.getMonth(); m < 12; m++) {

            start = ( m == today.getMonth() ) ? today.getDate() : 1;

            for (var d = start; d < 31; d++) {

                if (Schedule[m][d]) {

                    then = new Date(today.getFullYear(), m, d);

                    return (weekdays[then.getDay()] + ", " + months[m] + " " + d + " @ " + Schedule[m][d][0]);

                    }

                }

            }

        }

    }



function dateWriter2() {

    var today, then, start;

    today = new Date();

    if ( Games[today.getMonth()][today.getDate()] ) {// only true if you explicitly set it 

    return ("Today at " + Games[today.getMonth()][today.getDate()][0] + ' vs ' + Games[today.getMonth()][today.getDate()][1]+'.');

    }

    else {

        for (var m = today.getMonth(); m < 12; m++) {

            start = ( m == today.getMonth() ) ? today.getDate() : 1;

            for (var d = start; d < 31; d++) {

                if (Games[m][d]) {

                    then = new Date(today.getFullYear(), m, d);

                    return (weekdays[then.getDay()] + ", " + months[m] + " " + d + " @ " + Games[m][d][0] + "<br>" + " vs " + Games[m][d][1]);

                    }

                }

            }

        }

    }



document.writeln("<span class='bold'>" + dateWriter() + " in the cafeteria.</span><br>All football parents are highly encouraged to attend!");

document.writeln("<br><img src='images/1x1.gif' width='1' height='5' border='0'></td></tr>");

document.writeln("<tr><td width='13' valign='top'><img border='0' src='images/dot_red_anim_13x13.gif' width='13' height='13'></td><td valign='top'><span class='bold'><span class='red'>Next Game (<a href='schedule_v.htm'><span class='bold'>details</span></a>):</span></span></span><br><span class='bold'>" + dateWriter2() + "</span><br><img src='images/1x1.gif' width='1' height='5' border='0'></td></tr>");

// document.writeln(dateWriter2());

</script>

                      </td>

                    </tr>

                  </table>

I hope someone else has something less clunky. I couldn't even think of a good name for the function :)

Code:

function num_abbrev_str(num) {

var len = num.length, last_char = num.charAt(len - 1), abbrev

if (len == 2 && num.charAt(0) == '1') {

abbrev = 'th'

} else {

if (last_char == '1') {

abbrev = 'st'

} else if (last_char == '2') {

abbrev = 'nd'

} else if (last_char == '3') {

abbrev = 'rd'

} else {

abbrev = 'th'

}

}

return num + abbrev

}



alert(num_abbrev_str('22'))

Graeme Hackston, thanks for the code. I couldn't tell you clunky from non...I just need results. :)

Anyway, I played around with it a little -- trying to get it to work -- but have been unsuccessful so far.

Can you or someone else please explain how I'm supposed to include this in my JS?

Better yet, can you just show me? I'll learn from it, I promise.

Well it's clunky, anything with a bunch of else if and repeat statements is IMHO clunky.

I'd still like to see someone (maybe John) give you something better. For the time being this will work. If you want to capitalize them you can do that right in the function.

Code:



                  <table border="0" cellpadding="2" cellspacing="0" width="100%" bgcolor="#EFEFEF">

<!-- BEGIN NEXT BOOSTER CLUB AND NEXT GAME NOTICES -->

                    <tr>

                      <td width="13" valign="top"><img border="0" src="images/dot_red_anim_13x13.gif" width="13" height="13"></td>

                      <td valign="top"><span class="bold"><span class="red">Next Booster Club Meeting:</span></span><br>

<!-- SCRIPT below automatically updates the date of the next meeting based on the PC's date -->

<script>

var Schedule = new Array(12);

for ( var i = 0; i < 12; i++ ) {

    Schedule[i ] = new Array();

    }

var Games = new Array(12);

for ( var i = 0; i < 12; i++ ) {

    Games[i ] = new Array();

    }

var weekdays = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];

var months = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];



// Set the days you want

// Because the array starts with 0, 0=January, 1=February, and so on.  So, the month [7] below is one number behind the actual month number

// Schedule[month-1][day] = ["first message" , "second message"];

// Schedule[7][20] = ["7:00PM" , "THIS IS THE TOPIC TEXT"];  --- see original script in another file...shows where "topic" line is added, etc.

Schedule[7][19] = ["7:00pm" , ""]; // AUGUST

Schedule[7][26] = ["7:00pm" , ""];

Games[7][29] = ["7:30pm", "Leander (@ Leander)"]; // Season Opener

Schedule[8][2] = ["7:00pm" , ""]; // SEPTEMBER

Schedule[8][9] = ["7:00pm" , ""];

Games[8][12] = ["7:30pm" , "Westwood (@ Burger Center)"];

Schedule[8][16] = ["7:00pm" , ""];

Games[8][19] = ["7:30pm" , "McNeil (@ Round Rock)"];

Schedule[8][23] = ["7:00pm" , ""];

Games[8][26] = ["7:30pm" , "Hays (@ Burger Center)"];

Schedule[8][30] = ["7:00pm" , ""];

Games[9][3] = ["7:30pm" , "S F Austin (@ House Park)"]; // OCTOBER

Schedule[9][7] = ["7:00pm" , ""];

Games[9][9] = ["7:00pm" , "Westlake (@ Burger Center)"];

Schedule[9][14] = ["7:00pm" , ""];

Games[9][17] = ["7:30pm" , "Seguin (@ Seguin)"];

Schedule[9][21] = ["7:00pm" , ""];

Games[9][23] = ["7:00pm" , "Akins (@ Burger Center)"];

Schedule[9][28] = ["7:00pm" , ""];

Games[9][30] = ["7:00pm" , "San Marcos (@ Burger Center)"];

Schedule[10][4] = ["7:00pm" , ""]; // NOVEMBER

Games[10][7] = ["7:30pm" , "Crockett (@ Burger Center)"];

Schedule[10][11] = ["7:00pm" , ""];

// ADD MORE MEETINGS AND-OR PLAYOFF EVENTS HERE .... WHAT YOU SEE IS FROM 2002 RIGHT NOW

// Games[10][16] = ["1:00pm" , "Judson (@ Hays Stadium)"];

// Schedule[10][18] = ["7:00pm" , ""];

// Schedule[10][25] = ["7:00pm" , ""];



function dateWriter() {

    var today, then, start;

    today = new Date();

    if ( Schedule[today.getMonth()][today.getDate()] ) {// only true if you explicitly set it 

    return ("Today at " + Schedule[today.getMonth()][today.getDate()][0] + '.'); 

    }

    else {

        for (var m = today.getMonth(); m < 12; m++) {

            start = ( m == today.getMonth() ) ? today.getDate() : 1;

            for (var d = start; d < 31; d++) {

                if (Schedule[m][d]) {

                    then = new Date(today.getFullYear(), m, d);

                    return (weekdays[then.getDay()] + ", " + months[m] + " " + num_abbrev_str(d.toString()) + " @ " + Schedule[m][d][0]);

                    }

                }

            }

        }

    }



function dateWriter2() {

    var today, then, start;

    today = new Date();

    if ( Games[today.getMonth()][today.getDate()] ) {// only true if you explicitly set it 

    return ("Today at " + Games[today.getMonth()][today.getDate()][0] + ' vs ' + Games[today.getMonth()][today.getDate()][1]+'.');

    }

    else {

        for (var m = today.getMonth(); m < 12; m++) {

            start = ( m == today.getMonth() ) ? today.getDate() : 1;

            for (var d = start; d < 31; d++) {

                if (Games[m][d]) {

                    then = new Date(today.getFullYear(), m, d);

                    return (weekdays[then.getDay()] + ", " + months[m] + " " + num_abbrev_str(d.toString()) + " @ " + Games[m][d][0] + "<br>" + " vs " + Games[m][d][1]);

                    }

                }

            }

        }

    }



function num_abbrev_str(num) {

var len = num.length, last_char = num.charAt(len - 1), abbrev

if (len == 2 && num.charAt(0) == '1') {

abbrev = 'th'

} else {

if (last_char == '1') {

abbrev = 'st'

} else if (last_char == '2') {

abbrev = 'nd'

} else if (last_char == '3') {

abbrev = 'rd'

} else {

abbrev = 'th'

}

}

return num + abbrev

}



document.writeln("<span class='bold'>" + dateWriter() + " in the cafeteria.</span><br>All football parents are highly encouraged to attend!");

document.writeln("<br><img src='images/1x1.gif' width='1' height='5' border='0'></td></tr>");

document.writeln("<tr><td width='13' valign='top'><img border='0' src='images/dot_red_anim_13x13.gif' width='13' height='13'></td><td valign='top'><span class='bold'><span class='red'>Next Game (<a href='schedule_v.htm'><span class='bold'>details</span></a>):</span></span></span><br><span class='bold'>" + dateWriter2() + "</span><br><img src='images/1x1.gif' width='1' height='5' border='0'></td></tr>");

// document.writeln(dateWriter2());

</script>

                      </td>

                    </tr>

                  </table>

By the way Gordo, I suspect you were having problems using it because the variable d is a number. The function requires a string. When you're having problems like this the easiest way I've found to see what's going on is to use typeof.

try this

Code:

num = '22'

alert(typeof num)



num = 22

alert(typeof num)

Or, you can use typeof right in the function but this is adding yet another condition for the function to check.

If you use it like this you can remove .toString() from the function calls in Johns script.

Code:

function num_abbrev_str(num) {

if (typeof num == 'number') {

num = num.toString()

}

var len = num.length, last_char = num.charAt(len - 1), abbrev

if (len == 2 && num.charAt(0) == '1') {

abbrev = 'th'

} else {

if (last_char == '1') {

abbrev = 'st'

} else if (last_char == '2') {

abbrev = 'nd'

} else if (last_char == '3') {

abbrev = 'rd'

} else {

abbrev = 'th'

}

}

return num + abbrev

}



alert(num_abbrev_str('22'))



alert(num_abbrev_str(22))

Awesome...it works! :thumbsup:

Hmm, I don't think there's a non-clunky way of doing this. Here's a VBScript version that I use:

Code:

Function DateExt(ByVal intDay)

        If IsNumeric(intDay) Then

                If CInt(intDay) <> intDay Then Exit Function

                If (intDay < 11) OR (intDay > 13) Then

                        Select Case Right(intDay,1)

                                Case 1

                                        DateExt = intDay & "st"

                                Case 2

                                        DateExt = intDay & "nd"

                                Case 3

                                        DateExt = intDay & "rd"

                                Case Else

                                        DateExt = intDay & "th"

                        End Select

                Else

                        DateExt = intDay & "th"

                End If

        End If

End Function

This is definately clunky (kludgy?) but, fwiw, it might be useful to someone. :)

Code:



<html>

<head>

<title>Order in the Court!</title>

</head>

<body>

<pre>

<script type="text/javascript" language="javascript">



String.prototype.ordinalize = function() {

       var sNum, aNum = this.match(/^[^\d]*(\d+)[\w\W]*$/);

       if (aNum == null || aNum.length < 1) return this;

       else sNum = aNum[1];

       sNum += ['','st','nd','rd','th','th','th','th','th','th'][/^\d*1\d$/.test(sNum) ? 4 : Number(sNum.charAt(sNum.length - 1))];

       return this.replace(/\d+/, sNum);

}



var y, x = 'December 12, 1998.';

document.writeln(x.ordinalize());

x = 'On May 2, I began salivating...';

document.writeln(x.ordinalize());

x = 'The next game is on August 29.';

document.writeln(x.ordinalize());

x = 'I was 5 in line at the time.';

y = 'That was on the 3 of July.';

document.writeln(x.ordinalize() + ' ' + y.ordinalize());

x = 'Bite me.';

document.writeln(x.ordinalize());



</script>

</pre>

</body>

</html>

This almost looks like a good candidate for a coding challenge

title: De-clunk This Function

So far, cheesebag is leading the pack :D

Quote:

Code:

function num_abbrev_str(num) {

var len = num.length, last_char = num.charAt(len - 1), abbrev

if (len == 2 && num.charAt(0) == '1') {

abbrev = 'th'

} else {

if (last_char == '1') {

abbrev = 'st'

} else if (last_char == '2') {

abbrev = 'nd'

} else if (last_char == '3') {

abbrev = 'rd'

} else {

abbrev = 'th'

}

}

return num + abbrev

}

This will not work with 11, 12, and 13...

need to add...
(make this the first check)

Code:

 

if  ( (num == '11') || (num == '12') || (num == '13') ) {

abbrev = 'th'

} else if...

jsWalter

How about this; still a little kludgy, but it works

Code:

function getNumberSuffix(dNum)

{

        daySuffix = 'th';

        if(dNum != 11 && dNum != 12 && dNum != 13) 

        {

                if(dNum > 9) { dNum = dNum % 10; }

                if (dNum == 1) { daySuffix = 'st'; }

                if (dNum == 2) { daySuffix = 'nd'; }

                if (dNum == 3) { daySuffix = 'rd'; }

        }

        return daySuffix;

}

So you just call it like getNumberSuffix(14)

I'm not sure why one so similar to mine was judged clunky... here we go.

Code:

Number.prototype.ordinal = function () {

    var suffix = 'th',

            aNum = this;

    while (aNum > 100) {

            aNum -= 100;

    }

    if (aNum < 10 || aNum > 13) {

        switch (aNum % 10) {

            case 1:

                suffix = 'st';

                break;

            case 1: 

                suffix = 'nd';

                break;

            case 3: 

                suffix = 'rd';

                break;

        }

    }

    return new String(this + suffix);

}

three = 3;

twelve = 12;

twentyone = 21;

fortyfive = 45;

sixten = 610;

alert(three.ordinal() + 

    '\n' + twelve.ordinal() + 

    '\n' + twentyone.ordinal() + 

    '\n' + fortyfive.ordinal() + 

    '\n' + sixten.ordinal());

Don't forget that what doesn't work for 11 also doesn't work for 211.

Quote:

Originally posted by Choopernickel

Code:

case 1: suffix = 'nd'; break;

Code:

Just a small error - that should be "case 2:".

Hmm, sounds like an interesting challenge - I'll throw together my own version:

Code:

Number.prototype.ordinal=function(){

    var

        nModTen = this % 10;

    return (this + ['th','st','nd','rd'][nModTen > 3 ?

        0 :

        ( this % 100 - nModTen != 10) * nModTen]);

}