/    Sign up×
Community /Pin to ProfileBookmark

[RESOLVED] document.getElementById("BARclock") is null

This question is a little C# and a little javascript…

I’m making a clock that pulls the time from the server once, and then uses a script to add onto the time every time the code runs. Code is set to run every second. We pulled the date from the server, passed the values into the function and they go through just fine.

My problem occurs when the code gets to the document.getElementById(“BARclock”).firstChild.nodeValue = outPutBarcelona;

The error console in Firefox is telling me that BARclock is null. I’ve used an alert to test and make sure that I’m passing proper values into the object, so I believe the issue is that it isn’t finding an element with the id ‘BARclock’. In my HTML I do have a span tag with the id BARclock. It was able to find it just fine before we started to pass in the variable, and now, suddenly, it can’t, and for the life of me I cannot figure out why.

Unfortunately I can’t link you to an actual page because it isn’t live. If there’s anything I need to explain or clarify, feel free to ask.

Thanks,
Rinoa

The javascript file…

[QUOTE]

// JScript File

// x is a flag that checks whether or not we have pulled the time from the
//server yet.

var x=0;

function updateSeconds(serverSeconds, serverMinutes, serverHour, serverDay, serverDate, serverMonth, serverYear)

{

if (x == 0)//get the time and set x equal to one
{
var curSecond = Number(serverSeconds);
var curMinutes = Number(serverMinutes);
var curHour = Number(serverHour);
var curDay = Number(serverDay);
var curDate = Number(serverDate);
var curMonth = Number(serverMonth);
var curYear = Number(serverYear);
var curleap = eval(curYear % 4);

curMonth+= 1;
curDay-=1;
x =1;

}
else//updates the time by one second every time after x = 1
{ alert(curYear);
if (curSecond < 59)
{curSecond += 1;
}

else
{curSecond = 0;
if (curMinutes < 59)
{curMinutes += 1;
}
else
{curMinutes = 0;

if (curHour < 23)
{curHour += 1;}
else
{curHour=0;

if (((curMonth == 0) || (curMonth == 3) || (curMonth == 5) || (curMonth == 7) ||
(curMonth == 8) || (curMonth == 10)) && (curDate == 30))
{ curDate = 1;
curMonth+= 1;
}
else if (((curMonth == 4) || (curMonth == 6) || (curMonth == 9) || (curMonth == 11))
&& (curDate == 29))
{ curDate = 1;
curMonth+= 1;
}
else if (((curMonth == 2) && (curLeap == 1)) && (curDate == 28))
{
curDate = 1;
curMonth+= 1;
}
else if (((curMonth == 2) && (curLeap != 1)) && (curDate == 27))
{
curDate = 1;
curMonth+= 1;
}
else if ((curMonth == 12) && (curDate == 31))
{
curMonth= 1;
curDate= 1;
curYear+= 1;
}
else {
curDate+=1;
}

if (curDay < 6)
{curDay+=1;}
else
{curDay=0;}
}
}
}

}

//arrays to replace the number returned by DateTime with words.
var arrMonth = [ ‘0’, ‘Jan’, ‘Feb’, ‘Mar’, ‘April’,’May’,’Jun’, ‘Jul’, ‘Aug’, ‘Sept’, ‘Oct’, ‘Nov’, ‘Dec’];
var arrDay = [ ‘Mon’, ‘Tue’, ‘Wed’, ‘Thu’, ‘Fri’, ‘Sat’, ‘Sun’];

// adjustment for time zones //////////////////////

var BARhour = curHour + 8;
var NYhour = curHour – 4;
var LONhour = curHour + 1;
var TOKhour = curHour + 9;
var SYDhour = curHour + 10;

//Keeping hours of non GMT within 0 – 24
if (BARhour > 23)
{BARhour-=24;}

if (NYhour < 0)
{NYhour+= 24;}

if (LONhour > 23)
{LONhour-=24;}

if (TOKhour > 23)
{TOKhour-=24;}

if (SYDhour > 23)
{SYDhour-=24;}

// Pad the minutes and seconds with leading zeros, if less than 10
var currentMinutes = ( curMinutes < 10 ? “0” : “” ) + curMinutes;
var currentSeconds = ( curSecond < 10 ? “0” : “” ) + curSecond;

// putting the output strings together.

var outPutBarcelona = BARhour + “:” + currentMinutes;
var outPutNewYork = NYhour + “:” + currentMinutes;
var outPutLondon = LONhour + “:” + currentMinutes;
var outPutSydney = SYDhour + “:” + currentMinutes;
var outPutTokyo = TOKhour + “:” + currentMinutes;

var outPutGMT = arrDay[curDay] + “, ” + arrMonth[curMonth] + ” ” + curDate + ” ” + curYear + “, ” + curHour + “:” + currentMinutes + ” GMT”;

//inserting the time into the ids.
document.getElementById(“BARclock”).firstChild.nodeValue = OutPutBarcelona;
document.getElementById(“GMTclock”).firstChild.nodeValue = outPutGMT;
document.getElementById(“LONclock”).firstChild.nodeValue = outPutLondon;
document.getElementById(“NYclock”).firstChild.nodeValue = outPutNewYork;
document.getElementById(“SYDclock”).firstChild.nodeValue = outPutSydney;
document.getElementById(“TOKclock”).firstChild.nodeValue = outPutTokyo;

}

[/QUOTE]

The HTML code referencing the ids.

[QUOTE]

<asp:ScriptReference Path=”~/JScript/clock2.js” />

<div class=”clock”>
<span id=”GMTclock”>GMT</span> New York <span id=”NYclock”>NY</span> London <span
id=”LONclock”>LON</span> Barcelona <span id=”BARclock”>BAR</span> Tokyo <span id=”TOKclock”>TOK</span>
Sydney <span id=”SYDclock”>SYD</span>
</div>

[/QUOTE]

The relevant C#

[QUOTE]

using System;
using System.Data;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;

public partial class MainLayout : System.Web.UI.MasterPage
{
protected void Page_Load(object sender, EventArgs e)
{

DateTime currentTime = DateTime.Now;
int dayOfWeek = (int)currentTime.DayOfWeek;
ltrlGetTime.Text = “<script language=”javascript”> updateSeconds(‘” + currentTime.Second.ToString() + “‘,'” +
currentTime.Minute.ToString() + “‘,'” + currentTime.Hour.ToString() + “‘,'” + dayOfWeek.ToString() +
“‘,'” + currentTime.Day.ToString() + “‘,'” + currentTime.Month.ToString() + “‘,'” +
currentTime.Year.ToString() + “‘); setInterval(‘updateSeconds(null, null, null, null, null, null, null)’, 1000 ); </script>”;

}
}

[/QUOTE]

to post a comment
JavaScript

2 Comments(s)

Copy linkTweet thisAlerts:
@KorJul 17.2008 — It's nothing but a typo:
<i>
</i>document.getElementById("BARclock").firstChild.nodeValue = [COLOR="Red"]O[/COLOR]utPutBarcelona;

should be [COLOR="Blue"]o[/COLOR]utPutBarcelona;
Copy linkTweet thisAlerts:
@RinoaauthorJul 17.2008 — Sweet. Thanks! ?
×

Success!

Help @Rinoa spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 5.11,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...