1. HFJS – Book
Review Ch7
Brady Cheng

2. Agenda
 What is Form?
 How to Get Its Value?
 Events Invoked by Form
 Warning for Empty Input
 Warning for NaN
 Warning for Specific Patterns

3. Form
 We want to verify a form and its inputs, i.e.

4. Get value
 Method1
 <inputid="msgId" name=“msgName" type="text“/>
 Use getElementById(“msgId”);
 Method2
 Use form object
 <input id="msgId" name=“msgName" type="text“
onclick=“verifyFunc(this.form);”/>
function verifyFunc(theForm)
{
var value = theForm[“msgName”].value ;
}
property

5. Events
onchange
onfocus & onblur
select input leave
onblur

6. Empty Input
 In HTML
<div class = "field">
Enter something:
<input id="id1" name="name1" size="40"
onblur="isEmpty( this,
document.getElementById('spanId1'));" />
<span id="spanId1" class="help"> </span>
</div>
 In JS
function isEmpty(form, helpText){
if(form.value.length == 0){ same
if(helpText != null){
helpText.innerHTML = "NULL";
}
} return;
}

7. NaN(Not a Number)
 Use isNaN() build-in function
if( isNaN(form.value) )
{
alert(“this is not a number”);
}

8. Specific Patterns
 We can use Regular expressions to
match/filter the wanted patterns
 However, I want to skip this part until I start
to doc the Perl introduction! 
var regex = /some regex/;
if( regex.test(form.value))
{
//do something when matched
}
else
{
//do something when mismatched
}