TẠO FORM ĐĂNG KÝ BẰNG JAVASCRIPT VÀ THẺ INPUT

Phần Java Script

<script type=”text/javascript”>

function validateForm() {
//Họ phải được điền
var ho = document.forms[“myForm”][“ho”].value;
if (ho == “”) {
alert(“Họ không được để trống”);
return false;
}
//Tên phải được điền
var ten = document.forms[“myForm”][“ten”].value;
if (ten == “”) {
alert(“Tên không được để trống”);
return false;
}
//Email phải được điền chính xác
var email=document.forms[“myForm”][“email”].value;
var aCong=email.indexOf(“@”);
var dauCham = email.lastIndexOf(“.”);
if (email == “”) {
alert(“Email không được để trống”);
return false;
}
else if ((aCong<1) || (dauCham<aCong+2) || (dauCham+2>email.length)) {
alert(“Email bạn điền không chính xác”);
return false;
}
//Nhập số điện thoại
var dienThoai = document.forms[“myForm”][“dienThoai”].value;
var kiemTraDT = isNaN(dienThoai);
if (dienThoai == “”) {
alert(“Điện thoại không được để trống”);
return false;
}
if (kiemTraDT == true) {
alert(“Điện thoại phải để ở định dạng số”);
return false;
}
//Nhập số lượng muốn mua
var soLuong = document.forms[“myForm”][“soLuong”].value;
var kiemTraSL = isNaN(soLuong);
if ((soLuong == “”) || (soLuong <= 0)) {
alert(“Số lượng không được để trống và phải lớn hơn 0”);
return false;
}
if (soLuong > 100) {
alert(“Số lượng mua không được lớn hơn 100”);
return false;
}
if (kiemTraSL == true) {
alert(“Số lượng mua phải để ở định dạng số”);
return false;
}
//Chọn ngày nhận hàng
var nm = document.forms[“myForm”][“ngaymua”].value;
if (nm == “”) {
alert(“Ngày không được để trống”);
return false;
}
//Chọn kiểu thanh toán
var ck = document.getElementById(“ck”);
var tt = document.getElementById(“tt”);
if ((ck.checked == false) && (tt.checked == false)) {
alert(“Bạn phải chọn một kiểu thanh toán”);
return false;
}
}
</script>

phần HTML

<form action=”#” method=”post” name=”myForm” onsubmit=”return validateForm()”>
<table bgcolor=”#DDDDDD” id=”formdangky” style=”width: 450px;”>
<tbody>
<tr>
<td class=”tenhang” width=”118″>Họ:</td>
<td width=”320″><input name=”ho” type=”text” /></td>
</tr>
<tr>
<td class=”tenhang”>Tên:</td>
<td><input name=”ten” type=”text” /></td>
</tr>
<tr>
<td class=”tenhang”>Email:</td>
<td><input name=”email” type=”text” /></td>
</tr>
<tr>
<td class=”tenhang”>Số Điện Thoại:</td>
<td><input maxlength=”11/” name=”dienThoai” type=”text” /></td>
</tr>
<tr>
<td class=”tenhang”>Số Lượng Mua:</td>
<td><input name=”soLuong” type=”text” /></td>
</tr>
<tr>
<td class=”tenhang”>Ngày Nhận Hàng:</td>
<td><input id=”datepicker” name=”ngaymua” type=”text” /></td>
</tr>
<tr>
<td class=”tenhang”>Thanh Toán:</td>
<td><input id=”ck” name=”thanhToan” type=”radio” value=”chuyenKhoan” /> Chuyển Khoản
<input id=”tt” name=”thanhToan” type=”radio” value=”trucTiep” /> Trực Tiếp Khi Giao Hàng
</td>
</tr>
<tr>
<td><input name=”Submit” type=”submit” value=”Đăng Ký Mua” /></td>
<td><input name=”Reset” type=”reset” value=”Xóa” /></td>
</tr>
</tbody></table>
</form>

java script August 14, 2018