|
 |
|
ถามเรื่องการ check validate เช็คการกรอกข้อมูลลงใน "textbox" เกี่ยวกับ php และ jQuery |
|
 |
|
|
 |
 |
|
google =>jquery checkform
|
 |
 |
 |
 |
Date :
2011-12-07 10:36:32 |
By :
Dragons_first |
|
 |
 |
 |
 |
|
|
 |
 |
|
 |
 |
 |
|
|
 |
 |
|
ลองแบบนี้ดูครับ
Code (PHP)
<htlm>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript">
var HttPRequest = false;
function CallPOSTRequest(url,parameters) {
HttPRequest = false;
if (window.XMLHttpRequest) { // Mozilla, Safari,...
HttPRequest = new XMLHttpRequest();
if (HttPRequest.overrideMimeType) {
HttPRequest.overrideMimeType('text/html');
}
} else if (window.ActiveXObject) { // IE
try {
HttPRequest = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
HttPRequest = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e) {}
}
}
if (!HttPRequest) {
alert('Cannot create XMLHTTP instance');
return false;
}
HttPRequest.onreadystatechange = alertContener;
HttPRequest.open('POST', url, true);
HttPRequest.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
HttPRequest.setRequestHeader("Content-length", parameters.length);
HttPRequest.setRequestHeader("Connection", "close");
HttPRequest.send(parameters);
}
function chkname(){
var textArea = document.getElementById('txtbox1');
var len = textArea.value.length;
var check=1;
if(len==0){
document.getElementById('msg_name').style.color="#FF0000";
document.getElementById('msg_name').innerHTML='<img src="images/001_30.png"> กรุณากรอกข้อมูล';
}else{
document.getElementById('msg_name').style.color="#00CC00";
document.getElementById('msg_name').innerHTML='<img src="images/001_06.png">';
check=0;
}
return check;
}
function chkmail(){
var textArea = document.getElementById('txtbox2');
var len = textArea.value.length;
var check=1;
if(len==0){
document.getElementById('msg_mail').style.color="#FF0000";
document.getElementById('msg_mail').innerHTML='<img src="images/001_30.png"> กรุณากรอกข้อมูล';
}else{
document.getElementById('msg_mail').style.color="#00CC00";
document.getElementById('msg_mail').innerHTML='<img src="images/001_06.png">';
check=0;
}
return check;
}
function chkaddress(){
var textArea = document.getElementById('txtbox3');
var len = textArea.value.length;
var check=1;
if(len==0){
document.getElementById('msg_address').style.color="#FF0000";
document.getElementById('msg_address').innerHTML='<img src="images/001_30.png"> กรุณากรอกข้อมูล';
}else{
document.getElementById('msg_address').style.color="#00CC00";
document.getElementById('msg_address').innerHTML='<img src="images/001_06.png">';
check=0;
}
return check;
}
function chkphone(){
var textArea = document.getElementById('txtbox4');
var len = textArea.value.length;
var check=1;
if(len==0){
document.getElementById('msg_phone').style.color="#FF0000";
document.getElementById('msg_phone').innerHTML='<img src="images/001_30.png"> กรุณากรอกข้อมูล';
}else{
document.getElementById('msg_phone').style.color="#00CC00";
document.getElementById('msg_phone').innerHTML='<img src="images/001_06.png">';
check=0;
}
return check;
}
</script>
</head>
<body>
<form action="a.html" name="name_u" method="post">
<label>Name: <input type ="text" name="name_u" id="txtbox1" onblur="chkname();" /></label>
<span id="msg_name"></span><br>
<label>Email: <input type ="text" name="email_u" id="txtbox2" onblur="chkmail();" /></label>
<span id="msg_mail"></span><br><br>
<label>Address: <input type ="text" name="adress_u" id="txtbox3" onblur="chkaddress();" /></label>
<span id="msg_address"></span><br><br>
<label>Number Phone:<input type ="text" name="number_u" id="txtbox4" onblur="chkphone();" /></label>
<span id="msg_phone"></span><br><br>
<input type="submit" name="button" value="Submit"/>
</form>
</body>
</html>
|
 |
 |
 |
 |
Date :
2011-12-07 10:56:18 |
By :
000su000 |
|
 |
 |
 |
 |
|
|
 |
 |
|
 |
 |
 |
|
|
 |
 |
|
Jquery ประมาณนี้ แต่คุณต้องไปเพิ่มเติมต่อเองนะ
Code (JavaScript)
<script type="text/javascript">
$(document).ready(function(){
$("#btn_a").click(function(){
if ( ($("#txtbox1").val() == "") )
{
alert("name empty");
}
});
});
</script>
แก้ไข form นิดนึง
<form id="form1" name="form1" method="post">
<label>Name: <input type ="text" name="name_u" id="txtbox1" /></label><br>
<label>Email: <input type ="text" name="email_u" id="txtbox2" /></label><br>
<label>Address: <input type ="text" name="adress_u" id="txtbox3" /></label><br>
<label>Number Phone:<input type ="text" name="number_u" id="txtbox4" /></label><br>
<input type="button" id="btn_a" name="btn_a" value="Button"/>
</form>
|
ประวัติการแก้ไข 2011-12-07 11:12:47
 |
 |
 |
 |
Date :
2011-12-07 11:11:27 |
By :
grandraftz |
|
 |
 |
 |
 |
|
|
 |
 |
|
 |
 |
 |
|
|
 |
 |
|
ว้าว  ขอบคุณ ทุกคนที่มาช่วยตอบมากๆค่ะ เดี๋ยวจะลองทำดู เดี๋ยวนี้เลยค่ะ
|
 |
 |
 |
 |
Date :
2011-12-07 14:54:18 |
By :
roboto |
|
 |
 |
 |
 |
|
|
 |
 |
|
 |
 |
|
|
|

|
Load balance : Server 03
|