sylabus uts web based progamming for binus university
TRANSCRIPT
8/8/2019 Sylabus UTS Web Based Progamming for Binus University
http://slidepdf.com/reader/full/sylabus-uts-web-based-progamming-for-binus-university 1/2
Form Validation js
<form action="" name="myform" >
<table cellspacing="2" cellpadding="2" border="0">
<tr>
<td align="right">First Name</td>
<td><input type="text" name="FirstName"></td>
</tr>
<tr>
<td align="right">Last Name</td>
<td><input type="text" name="LastName"></td>
</tr>
<tr>
<td align="right">EMail</td><td><input type="text" name="Email"></td>
</tr>
<tr>
<td align="right">Phone</td>
<td><input type="text" name="Phone"></td>
</tr>
<tr>
<td align="right">Address</td>
<td><textarea cols="20" rows="5"
name="Address"></textarea></td>
</tr>
<tr>
<td align="right">Country</td>
<td>
<SELECT name="Country">
<option value="" selected>[choose yours]<option value="008">Albania
<option value="012">Algeria
</SELECT>
</td>
</tr>
<tr>
<td align="right"></td>
<td><input type="submit" value="Submit"></td>
</tr>
</table>
</form>
<script language="JavaScript" type="text/javascript">
//You should create the validator only after the
definition of the HTML form
var frmvalidator = new Validator("myform");
frmvalidator.addValidation("FirstName","req","Please
enter your First Name");
frmvalidator.addValidation("FirstName","maxlen=20",
"Max length for FirstName is 20");
frmvalidator.addValidation("FirstName","alpha");
frmvalidator.addValidation("LastName","req");
frmvalidator.addValidation("LastName","maxlen=20");
frmvalidator.addValidation("Email","maxlen=50");
frmvalidator.addValidation("Email","req");
frmvalidator.addValidation("Email","email");
frmvalidator.addValidation("Phone","maxlen=50");
frmvalidator.addValidation("Phone","numeric");
frmvalidator.addValidation("Address","maxlen=50");
frmvalidator.addValidation("Country","dontselect=0");
</script>
Hasil
Image Mapping w/ js :
<html>
<head>
<script type="text/javascript">
function writeText(txt)
{
document.getElementById("desc").innerHTML=txt;
}
</script>
</head>
<body>
<img src ="planets.gif" width ="145" height ="126"alt="Planets" usemap="#planetmap" />
<map name="planetmap">
<area shape ="rect" coords ="0,0,82,126"
onMouseOver="writeText('The Sun and the gas giant
planets like Jupiter are by far the largest objects in
our Solar System.')"
href ="sun.htm" target ="_blank" alt="Sun" />
<area shape ="circle" coords ="90,58,3"
onMouseOver="writeText('The planet Mercury is very
difficult to study from the Earth because it is always
so close to the Sun.')"
href ="mercur.htm" target ="_blank" alt="Mercury" />
<area shape ="circle" coords ="124,58,8"
onMouseOver="writeText('Until the 1960s, Venus was
often considered a twin sister to the Earth because
Venus is the nearest planet to us, and because the two
planets seem to share many characteristics.')"
href ="venus.htm" target ="_blank" alt="Venus" />
</map>
<p id="desc"></p> hasil
</body>
</html>
Js validation w jika field kosong
8/8/2019 Sylabus UTS Web Based Progamming for Binus University
http://slidepdf.com/reader/full/sylabus-uts-web-based-progamming-for-binus-university 2/2
E-mail Validation
TABLE
<table border="1">
<tr> <td>
<p>This is a paragraph</p>
<p>This is another paragraph</p>
</td>
<td>This cell contains a table:
<table border="1"> <tr>
<td>A</td>
<td>B</td>
</tr> <tr>
<td>C</td> <td>D</td>
</tr>
</table>
</td>
</tr>
<tr> <td>This cell contains a list
<ul>
<li>apples</li>
<li>bananas</li>
<li>pineapples</li>
</ul> </td>
<td>HELLO</td>
</tr>
</table> </body>
<html>
<body>
<h4>Cell that spans two columns:</h4> <table border="1">
<tr>
<th>Name</th>
<th colspan="2">Telephone</th>
</tr>
<tr> <td>Bill Gates</td>
<td>555 77 854</td>
<td>555 77 855</td>
</tr>
</table>
<h4>Cell that spans two rows:</h4>
<table border="1">
<tr> <th>First Name:</th>
<td>Bill Gates</td>
</tr>
<tr>
<th rowspan="2">Telephone:</th>
<td>555 77 854</td> </tr>
<tr>
<td>555 77 855</td>
</tr>
</table>
</body>
</html>
mage map biasa
<body>
<p>Click on the sun or on one of the planets to watch itcloser:</p>
<img src="planets.gif" width="145" height="126" alt="Planets"
usemap="#planetmap" />
<map name="planetmap"> <area shape="rect" coords="0,0,82,126" alt="Sun"
href="sun.htm" />
<area shape="circle" coords="90,58,3" alt="Mercury"
href="mercur.htm" />
<area shape="circle" coords="124,58,8" alt="Venus"
href="venus.htm" /> </map>
</body>