ជាទូទៅ យើងត្រូវប្រើប្រាស់ធាតុ HTML form ដើម្បីបង្កើតទំរង់បែបបទទាំងឡាយដោយធ្វើដូចខាងក្រោមនេះ៖
<!DOCTYPE html>
<html>
<head>
<link href='https://fonts.googleapis.com/css?family=Odor+Mean+Chey' rel='stylesheet'>
</head>
<body style="font:14px/1.5 'Odor Mean Chey'">
<form name="myForm" action="/action_page.php" onsubmit="return validateForm()" method="post">
ឈ្មោះៈ<input type="text" name="fname" />
ពាក្យសំងាត់ៈ<input type="password" name="fpassword" />
<input type="submit" value="បញ្ជូន" /> <input type="reset" value="លុបចេញ" />
</form>
<script>
function validateForm() {
var valn = document.forms["myForm"]["fname"].value;
var valp = document.forms["myForm"]["fpassword"].value;
if ((valn == "") || (valp == "")) {
alert("អ្នកត្រូវបំពេញទំរង់បែបបទនេះអោយបានពេញលេញ។");
return false;
}
}
</script>
</body>
</html>
នៅលើបន្ទាត់លេខ 8 ការសរសេរថា onsubmit="return validateForm()" គឺជាការភ្ជាប់ហេុតការណ៍ submit ឬ onsubmit ទៅនឹងលទ្ធផលដែលក្បួន validateForm() បញ្ជូនមក។ ហេតុការណ៍ submit កើតឡើងនៅពេលដែលប៊ូតុង submit (បញ្ជូន) ត្រូវបានចុច។ ហើយបើលទ្ធផលជាតក្កអថេរ false ទំរង់បែបបទខាងលើ នឹងមិនបញ្ជូនទិន្នន័យណាមួយទៅ server ឡើយ។
នៅលើបន្ទាត់លេខ 9 គឺជាការបង្កើតធាតុ HTML មួយសំរាប់ទទួលយកទិន្នន័យដែលមានប្រភេទជាអត្ថបទ។
នៅលើបន្ទាត់លេខ 10 គឺជាការបង្កើតធាតុ HTML មួយទៀតសំរាប់ទទួលយកទិន្នន័យមានប្រភេទជាពាក្យសំងាត់ ដែលនឹងមិនត្រូវបង្ហាញអោយឃើញឡើយ។
នៅលើបន្ទាត់លេខ 11 គឺជាការបង្កើតប៊ូតុងចំនួនពីរ។ ប៊ូតុងដើមគេគឺជាប៊ូតុង submit ប្រើសំរាប់ចុចប្រមូលយកទិន្នន័យនៅក្នុងទំរង់បែបបទបញ្ជូនទៅ server ។ ចំណែកឯប៊ូតុងបន្ទាប់ពីនោះ គឺជាប៊ូតុងចុចលុបទិន្នន័យនៅក្នុងទំរង់់បែបបទ ក្នុងករណីដែលអ្នកប្រើប្រាស់ចង់សរសេរបញ្ចូលទិន្នន័យសារជាថ្មីម្តងទៀត (reset) ។
នៅលើបន្ទាត់លេខ 16 គឺជាការចំលងយកទិន្នន័យនៅក្នុងធាតុ HTML មានឈ្មោះថា fname នៅក្នុងទំរង់បែបបទខាងលើដែលមានឈ្មោះថា myForm ។
នៅលើបន្ទាត់លេខ 17 គឺជាការចំលងយកទិន្នន័យនៅក្នុងធាតុ HTML មានឈ្មោះថា fpassword នៅក្នុងទំរង់បែបបទខាងលើដែលមានឈ្មោះថា myForm ។
នៅលើបន្ទាត់លេខ 18 គឺជាការផ្ទៀងផ្ទាត់មើលថា តើអ្នកប្រើប្រាស់បញ្ចូលទិន្នន័យទៅក្នុងទំរង់បែបបទបានពេញសព្វគ្រប់ដែរឬទេ។ ហើយបើនៅខ្វះទិន្នន័យណាមួយ ក្បួនឆ្លើយតបហេតុការណ៍ validateForm() នឹងបង្ហាញព័ត៌មានប្រាប់អ្នកប្រើប្រាស់អោយបំពេញទំរង់បែបបទអោយបានសព្វគ្រប់ រួចបញ្ជូនលទ្ធផលជាតក្កអថេរ false កាន់កន្លែងដែលវាត្រូវបានយកទៅប្រើ៕
