Announcement

**TinyScript** · Apr 12, 2009, 05:31 PM

Use innerHTML

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> How Many Days till Christmas? </TITLE>

</HEAD>

<center><div id="latest-post" class="wide-post">
<h1 class="title" align="left">JavaScript - How Many Days till Christmas?</a></h1>
<div class="entry"><br>
<p align="left">
</center>

<form name=userform>
Name: <input type=text name="name" size=15 value="" onChange="this.form.name.value=this.value;readout.innerHTML+=this.value">
<input type="button" name="submit" value="Submit">
<input type="button" name="clear" value="Clear"><br>
</form>
<div id="readout"></div>
<script language="javascript">
<!---Hide from non-javascript browswers

var readout=document.getElementById("readout");


function KeyUpEvent()
{
var txt1 = document.getElementById("txt1");
}
function XmasDays(CurrentDay)
{
var XYear=CurrentDay.getFullYear();
var XDay=new Date("December 25, 2009");
XDay.setFullYear(XYear);
var DayCount=(XDay-CurrentDay)/(1000*60*60*24);
DayCount=Math.round(DayCount);
return DayCount;
}
function MonthTxt(MonthNumber)
{
var Month=new Array();
Month[1]="January";
Month[2]="February";
Month[3]="March";
Month[4]="April";
Month[5]="May";
Month[6]="June";
Month[7]="July";
Month[8]="August";
Month[9]="September";
Month[10]="October";
Month[11]="November";
Month[12]="December";
return Month[MonthNumber];
}
function clear()
{
document.getElementById("<%= Txt1.ClientID %>").value = "";
}
//Stop hiding--->
</script>

</HEAD>
<script language="JavaScript">
var Today=new Date("December 25, 2009");
var ThisDay=Today.getDate();
var ThisMonth=Today.getMonth()+1;
var ThisYear=Today.getFullYear();
var DaysLeft=XmasDays(Today);
var MonthName=MonthTxt(ThisMonth);
readout.innerHTML+="Today is "+MonthName+" "+ThisDay+" <br>";
if (DaysLeft > 5)
{
readout.innerHTML+="Only "+DaysLeft+" days till Christmas"
}
else
{
readout.innerHTML+="Happy Holidays from "+name+" <br>";
}
// Stop hiding
</script>
</HTML>
clark101 is offline Add to clark101's Reputation Report Post   	Reply With Quote

**clark101** · Apr 12, 2009, 07:07 PM

New problem

Thanks for the help TinyScript,

I just thought of something else that needs to be added in the code and I think I am just adding in the wrong area...I want an error message to come up if the text box is left null. I have added a new function called name(field) the code looks like this

function name(field)
{
if(field.value==" ")
readout.innerHTML+=this.value;
}
else
{
alert("You must enter a name");
field.focus();
}
}

I added this as the first function.

**TinyScript** · Apr 12, 2009, 07:43 PM

you shouldn't use name as a variable or as an id.
i changed it to fieldname

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> How Many Days till Christmas? </TITLE>

</HEAD>

<center><div id="latest-post" class="wide-post">
<h1 class="title" align="left">JavaScript - How Many Days till Christmas?</a></h1>
<div class="entry"><br>
<p align="left">
</center>

<form name=userform>
Name: <input type=text name="name" size=15 value="" onChange="this.form.name.value=this.value;fieldname(this.value);readout.innerHTML+=this.value">
<input type="button" name="submit" value="Submit">
<input type="button" name="clear" value="Clear"><br>
</form>
<div id="readout"></div>
<script language="javascript">
<!---Hide from non-javascript browswers

var readoutNew=false
var readout=document.getElementById("readout");


function KeyUpEvent()
{
var txt1 = document.getElementById("txt1");
}
function XmasDays(CurrentDay)
{
var XYear=CurrentDay.getFullYear();
var XDay=new Date("December 25, 2009");
XDay.setFullYear(XYear);
var DayCount=(XDay-CurrentDay)/(1000*60*60*24);
DayCount=Math.round(DayCount);
return DayCount;
}
function MonthTxt(MonthNumber)
{
var Month=new Array();
Month[1]="January";
Month[2]="February";
Month[3]="March";
Month[4]="April";
Month[5]="May";
Month[6]="June";
Month[7]="July";
Month[8]="August";
Month[9]="September";
Month[10]="October";
Month[11]="November";
Month[12]="December";
return Month[MonthNumber];
}
function clear()
{
document.getElementById("<%= Txt1.ClientID %>").value = "";
}
//Stop hiding--->
</script>

</HEAD>
<script language="JavaScript">

function fieldname(field)
{
if (isNaN(field)) {
readoutNew=true;
}
else
{
readoutNew=false

alert("You must enter a name");
field.focus();
}
}


var Today=new Date("December 25, 2009");
var ThisDay=Today.getDate();
var ThisMonth=Today.getMonth()+1;
var ThisYear=Today.getFullYear();
var DaysLeft=XmasDays(Today);
var MonthName=MonthTxt(ThisMonth);
readout.innerHTML+="Today is "+MonthName+" "+ThisDay+" <br>";
if (DaysLeft > 5)
{
readout.innerHTML+="Only "+DaysLeft+" days till Christmas"
}
else
{
if (readoutNew==true)readout.innerHTML+="Happy Holidays from "+name+" <br>";
}
// Stop hiding
</script>
</HTML>
clark101 is offline Add to clark101's Reputation Report Post   	Reply With Quote

**Philip M** · Apr 13, 2009, 02:52 AM

if(field.value=="")is a very weak validation as even a single space or a ? will return false (i.e. pass the validation). !isNaN() simply checks that the value is not a number. (I now see that your statement was if(field.value==" ") which means "if the value is just a single space".
Use something like this:-

Code:

function username(field) {
x = field.value;
x = x.replace(/^\s+|\s+$/g,"");  // strip leading and trailing spaces
x = x.replace.([^a-z\-\'\s]/gi,"");  // strip anything but a-z space hyphen apostrophe - no other chararcters can appear in a proper name
if (x.length < 3) {   // minimum 2 characters
alert ("You must enter a name");
field.focus();
return false;
}
else {
readout.innerHTML += x;  // i.e a validated name
}
}

Announcement

I need help - cant seem to find my error

I need help - cant seem to find my error

Comment

Comment

Comment

Comment