<html>
<head>
<style>
p {
width:100px;
}
.err {
color:red;
font-style:italic;
font-size:10px;
}
</style>
<script>
function cek(){
status_oke = true;
// cek NIM tidak boleh kosong
if (surat.nama.value.trim() == ""){
document.getElementById("err_nama").innerHTML="Nama Harus Diisi";
status_oke = false;
} else {
document.getElementById("err_nama").innerHTML="";
}
// cek nama tidak boleh kosong
if (surat.email.value.trim() == ""){
document.getElementById("err_email").innerHTML="Email Harus Diisi";
status_oke = false;
} else {
document.getElementById("err_email").innerHTML="";
}
// cek komentar tidak boleh kosong
if (surat.komen.value.trim() == ""){
document.getElementById("err_komen").innerHTML="komentar Harus Diisi";
status_oke = false;
} else {
document.getElementById("err_komen").innerHTML="";
}
return status_oke;
}
function validateForm()
{
var x=document.forms["surat"]["email"].value;
var atpos=x.indexOf("@");
var dotpos=x.lastIndexOf(".");
if (atpos<1 || dotpos<atpos+2 || dotpos+2>=x.length)
{
alert("Not a valid e-mail address");
return false;
}
}
function tutup_form_komen(){
document.getElementById("komen").innerHTML="";
}
function form_komen(){
cForm = "<form action='#' method='post' onsubmit='return cek(), validateForm();' name='surat'>";
cForm += "email : <input type='text' name='email' /><span class = 'err' id='err_email' ></span><br/>";
cForm += "Nama : <input type='text' name='nama' /><span class = 'err' id='err_nama' ></span><br/>";
cForm += "Komentar : <br/>";
cForm += "<textarea name='komen'></textarea><span class = 'err' id='err_komen' ></span><br/>";
cForm += "<br/><input type='submit' value='Publish' />";
cForm += "</form>";
document.getElementById("komen").innerHTML=cForm;
}
</script>
</head>
<body>
<input type="button" value="Komen" onClick="form_komen()">
<input type="button" value="Tutup Komen" onClick="tutup_form_komen()">
<div id="komen"></div>
</body>
</html>
