|
|
|
รบกวนสอบถามเรื่อง การเชค text filed ถ้าไม่มีการกรอกข้อมูล เมื่อกดปุ่ม ตกลง ให้แสดงข้อความข้างหลัง text filed นั้น |
|
|
|
|
|
|
|
พอดีไม่เก่งเรื่อง jquery อ่าครับ อยากได้เป็นแบบ php javascript อ่าครับ T_T ผู้รู้รบกวนช่วยบอกทีคับผม
|
|
|
|
|
Date :
2013-02-16 18:04:10 |
By :
ฝึกหัด |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
Code (PHP)
<script>
function Check(){
var id=document.getElementById("name");
var span=document.getElementById("spanname");
if(id.value==''){
span.text="*";
return false;
}else{
span.text="";
return true;
}
}
</script>
<form>
<input type="text" id="name" value=""> <span id="spanname">*</span>
<input type="submit" onclick="return Check();">
</form>
ลองดูครับ
|
ประวัติการแก้ไข 2013-02-16 18:11:59
|
|
|
|
Date :
2013-02-16 18:11:35 |
By :
Ex-[S]i[L]e[N]t |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
ลองดูครับ
<script src="http://code.jquery.com/jquery-latest.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=utf8" />
<style type="text/css">
input:disabled{
font-style:italic;
background-color:#808040;
color:white;
}
.hide{
display:none;
}
</style>
<script type="text/javascript">
<!--
$(document).ready(function(){
var submitBTN = $("input[type='submit']");
var allInput = $("input[type='text']");
submitBTN.click(function(e){
e.preventDefault();
allInput.each(function(){
if($(this).val().length == 0) $(this).next("span").css({"color":"red"}).show(400).delay(1000).fadeOut(200);
});
});
});
//-->
</script>
<form method="post" action="">
<input type="text" name=""><span class="hide">please name</span><br /><br />
<input type="text" name=""><span class="hide">please lastname</span><br /><br />
<input type="text" name=""><span class="hide">please family name</span><br /><br />
<input type="text" name=""><span class="hide">please age</span><br /><br />
<input type="text" name=""><span class="hide">please mobile</span><br /><br />
<input type="text" name=""><span class="hide">please email</span><br /><br />
<input type="text" name=""><span class="hide">please twitter</span><br /><br />
<input type="submit" />
</form>
|
|
|
|
|
Date :
2013-02-16 18:19:48 |
By :
sakuraei |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
โค้ดเดิมของคุณ Unidentifier นั้น ทำให้ฟอร์มไม่ submit ในทุกๆ กรณีครับ
เพราะมีการเรียก e.preventDefault(); ทุกครั้ง
ดังนั้นเราต้องเปลี่ยนแปลงนิดนึง
แบบนี้ครับ
<script src="http://code.jquery.com/jquery-latest.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=utf8" />
<style type="text/css">
input:disabled{
font-style:italic;
background-color:#808040;
color:white;
}
.hide{
display:none;
}
</style>
<script type="text/javascript">
<!--
$(document).ready(function(){
var submitBTN = $("input[type='submit']");
var allInput = $("input[type='text']");
submitBTN.click(function(e){
var numErrors = 0; // เพิ่มตัวแปรจับ error
allInput.each(function(){
if($(this).val().length == 0) {
numErrors++; // เพิ่มค่านี้หากมีช่องไหนไม่ได้กรอก
$(this).next("span").css({"color":"red"}).show(400).delay(1000).fadeOut(200);
}
});
if (numErrors) { // หาก numErrors มีค่ามากกว่า 0
e.preventDefault(); // หยุดการ submit ฟอร์ม
}
});
});
//-->
</script>
<form method="post" action="">
<input type="text" name=""><span class="hide">please name</span><br /><br />
<input type="text" name=""><span class="hide">please lastname</span><br /><br />
<input type="text" name=""><span class="hide">please family name</span><br /><br />
<input type="text" name=""><span class="hide">please age</span><br /><br />
<input type="text" name=""><span class="hide">please mobile</span><br /><br />
<input type="text" name=""><span class="hide">please email</span><br /><br />
<input type="text" name=""><span class="hide">please twitter</span><br /><br />
<input type="submit" />
</form>
|
|
|
|
|
Date :
2013-02-16 20:33:01 |
By :
cookiephp |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
ฮ่าๆๆๆ เดี๋ยวส่งโทรจิตไปน่ะ ตอนนี้อิ่มทิพย์ไปพลางๆก่อนน่ะ ...อิอิ
|
|
|
|
|
Date :
2013-02-16 20:54:17 |
By :
sakuraei |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
ขอบคุณมากคับบบบบบ ทำได้แล้ว ผมพึ่งหัดทำคับ อิอิ
|
|
|
|
|
Date :
2013-02-16 21:10:54 |
By :
ฝึกหัด |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
ถามเพื่มเติมคับ
สมมุติว่ามี text field อยู่สองช่อง ถ้าอยากกำหนดให้ ใส่ช่องไหนก็ได้ที่ type เป็น text จะทำได้ไหมคับ
|
|
|
|
|
Date :
2013-02-16 21:17:39 |
By :
ฝึกหัด |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
แล้วอีกอันคับ ที่เป็น <select> จะเชคด้วยได้ไหมคับ
|
|
|
|
|
Date :
2013-02-16 21:19:44 |
By :
ฝึกหัด |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
สมัครสมาชิกก่อนครับ แล้วจะกลับมาตอบให้
|
|
|
|
|
Date :
2013-02-16 22:19:01 |
By :
sakuraei |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
Code (PHP)
<script src="http://code.jquery.com/jquery-latest.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=utf8" />
<style type="text/css">
input:disabled{
font-style:italic;
background-color:#808040;
color:white;
}
.hide{
display:none;
}
</style>
<script type="text/javascript">
<!--
$(document).ready(function(){
var submitBTN = $("input[type='submit']");
var allInput = $("input[type='text']");
submitBTN.click(function(e){
e.preventDefault();
var checkVal = true;
var selectionBox = $("select#gender");
if($("option:selected",selectionBox).val().length ==0){
checkVal=false;
$(selectionBox).next("span").css({"color":"red","padding-left":"1em;"})
.fadeIn(500).delay(2000).fadeOut(300);
}
allInput.each(function(){
if($(this).val().length == 0){
checkVal = false;
$(this)//.css({"border":"1px solid red"})
.next("span").css({"color":"red","padding-left":"1em;"})
.fadeIn(500).delay(2000).fadeOut(300);
}
});
if(checkVal) $("form#formEntry").submit();
});
});
//-->
</script>
<form method="post" action="new.php" id="formEntry">
<input type="text" name=""><span class="hide">please name</span><br /><br />
<input type="text" name=""><span class="hide">please lastname</span><br /><br />
<input type="text" name=""><span class="hide">please family name</span><br /><br />
<input type="text" name=""><span class="hide">please age</span><br /><br />
<input type="text" name=""><span class="hide">please mobile</span><br /><br />
<input type="text" name=""><span class="hide">please email</span><br /><br />
<input type="text" name=""><span class="hide">please twitter</span><br /><br />
<select name="gender" id="gender" style="width:150px;">
<option value="">กรุณาเลือกเพศด้วยค่ะ</option>
<option value="male">เพศชาย</option>
<option value="female">เพศหญิง</option>
</select>
<span class="hide">please gender</span><br /><br />
<input type="submit" />
</form>
|
|
|
|
|
Date :
2013-02-17 00:41:54 |
By :
sakuraei |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
มันไม่ไปไหนเลยคับ นิ่งสนิท ฮือๆ
|
|
|
|
|
Date :
2013-02-17 01:11:05 |
By :
ksttang |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
บรรทัดที่ 37 if(checkVal) $("form#formEntry").submit();
ลองเปลี่ยนเป็นอันนี้ดูครับ
if(checkVal) document.getElementById("formEntry").submit();
หรือ
if(checkVal) document.forms[0].submit();
|
|
|
|
|
Date :
2013-02-17 01:15:26 |
By :
cookiephp |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
งั้นลองเอาโค้ดชุดนี้ไปผสมกับของคุณแมวเหมียว No.7 น่ะครับ อย่าให้ผมป้อนให้หมดทุกอย่าง
http://jsfiddle.net/C6YSs/
Code (PHP)
var selectionBox = $("select#gender");
if($("option:selected",selectionBox).val().length ==0){
checkVal=false;
$(selectionBox).next("span").css({"color":"red","padding-left":"1em;"})
.fadeIn(500).delay(2000).fadeOut(300);
}
Code (PHP)
<select name="gender" id="gender" style="width:150px;">
<option value="">กรุณาเลือกเพศด้วยค่ะ</option>
<option value="male">เพศชาย</option>
<option value="female">เพศหญิง</option>
</select>
<span class="hide">please gender</span><br /><br />
|
|
|
|
|
Date :
2013-02-17 01:18:05 |
By :
sakuraei |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
if(checkVal) document.forms[0].submit();
น่าจะได้ล่ะครับ
|
|
|
|
|
Date :
2013-02-17 01:23:31 |
By :
sakuraei |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
โอเคครับ ถ้าเป็นกรณี มี <select> สองช่อง จะทำอย่างไรครับ
|
|
|
|
|
Date :
2013-02-17 01:41:49 |
By :
ksttang |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var selectionBox = $("select#gender");
ให้เป็น
var selectionBox = $("select");
ทีนี้ไม่ว่าจะมี select กี่ตัวก็ออกมาหมดล่ะครับ
|
|
|
|
|
Date :
2013-02-17 01:44:43 |
By :
sakuraei |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
แล้วถ้า เกิด เลือก select 1 แล้วยังไม่ได้เลือก select 2 ผมลองทำตามวิธีพี่ดูแล้ว มันไม่แจ้งเตือนคับผม ผมลองแก้แบบนี้ไม่รุ้ถูกหรือเปล่า
ก็ไม่ได้คับ
var selectionBox = $("select#P_type" , "select#P_write");
|
|
|
|
|
Date :
2013-02-17 01:51:36 |
By :
ksttang |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
ความรู้ได้มาจากการทดลองและค้นคว้าครับ ... สู้ๆ พี่ไปนอนก่อนน่ะ
|
|
|
|
|
Date :
2013-02-17 02:00:44 |
By :
sakuraei |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
ขอบคุณมากคับ สำหรับคำแนะนำคับผม ^^
|
|
|
|
|
Date :
2013-02-17 02:03:58 |
By :
ksttang |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
เอาไว้ถ้ายังหาคำตอบไม่ได้ พรุ่งนี้พี่จะกลับมาช่วยน่ะ
แต่แนะไว้นิดนึง ต้องใช้ .each() หรือไม่ก็ต้อง
ทำเหมือนกันสองครั้งแต่เปลี่ยนชื่อไอดี
if($("select#P_type").....)
......
.......
if($("select#P_write")......)
.....
......
Code (PHP)
<script src="http://code.jquery.com/jquery-latest.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=utf8" />
<style type="text/css">
input:disabled{
font-style:italic;
background-color:#808040;
color:white;
}
.hide{
display:none;
}
</style>
<script type="text/javascript">
<!--
$(document).ready(function(){
var submitBTN = $("input[type='submit']");
submitBTN.click(function(e){
e.preventDefault();
var allInput = $("input[type='text']");
var selectionBox = $("select.required");
var checkVal = true;
$(selectionBox).each(function(){
if($("option:selected", this).val().length ==0){
checkVal=false;
$(this).next("span").css({"color":"red","padding-left":"1em;"})
.fadeIn(500).delay(2000).fadeOut(300);
}
});
allInput.each(function(){
if($(this).val().length == 0){
checkVal = false;
$(this).next("span").css({"color":"red","padding-left":"1em;"})
.fadeIn(500).delay(2000).fadeOut(300);
}
});
if(checkVal) document.forms[0].submit();
});
});
//-->
</script>
<form method="post" action="new.php" id="formEntry">
<input type="text" name="" /><span class="hide">please name</span><br /><br />
<input type="text" name="" /><span class="hide">please lastname</span><br /><br />
<input type="text" name="" /><span class="hide">please family name</span><br /><br />
<input type="text" name="" /><span class="hide">please age</span><br /><br />
<input type="text" name="" /><span class="hide">please mobile</span><br /><br />
<input type="text" name="" /><span class="hide">please email</span><br /><br />
<input type="text" name="" /><span class="hide">please twitter</span><br /><br />
<select name="gender" id="gender" class="required" style="width:150px;">
<option value="">กรุณาเลือกเพศด้วยค่ะ</option>
<option value="male">เพศชาย</option>
<option value="female">เพศหญิง</option>
</select>
<span class="hide">please gender</span><br /><br />
<select name="province" id="province" class="required" style="width:150px;">
<option value="">กรุณาเลือก province</option>
<option value="CMI">chaing mai</option>
<option value="CRI">chiang rai</option>
</select>
<span class="hide">please province</span><br /><br />
<input type="submit" />
</form>
|
ประวัติการแก้ไข 2013-02-17 11:30:02 2013-02-17 11:33:06
|
|
|
|
Date :
2013-02-17 02:09:00 |
By :
sakuraei |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
คับผม
|
|
|
|
|
Date :
2013-02-17 02:20:43 |
By :
ksttang |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
ผมมีปัญหาใหม่มาอีกละคับ อิอิ
คือ ถ้ามี text field อยู่สอง field
เช่น ชื่อภาษาไทย กับ ชื่อภาษาอังกฤษ
ต้องการตรวจสอบ ถ้าไม่กรอกอะไรเลยทั้งสองช่อง ให้ขึ้นเตือน
แต่ถ้ากรอกช่องใดช่องหนึ่ง ถือว่า ผ่าน แนะนำด้วยน้าคับผม แหะๆ
|
|
|
|
|
Date :
2013-02-17 03:14:31 |
By :
ksttang |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
Load balance : Server 04
|