ตรวจสอบฟอร์ม form ก่อน submit ด้วย jquery
เขียนเมื่อ 15 ปีก่อน โดย Ninenik Narkdeeform jquery
คำสั่ง การ กำหนด รูปแบบ ตัวอย่าง เทคนิค ลูกเล่น การประยุกต์ การใช้งาน เกี่ยวกับ form jquery
ดูแล้ว 41,155 ครั้ง
คำเตือน! เนื้อหาต่อไปนี้ เป็นเนื้อหาเก่า อาจจะไม่เหมาะสำหรับนำไปใช้งาน
หรือไม่สามารถใช้งานได้แล้ว
ลองดูที่ใหม่กว่า https://www.ninenik.com/content.php?arti_id=579 เป็นแนวทางแทน
ลองดูที่ใหม่กว่า https://www.ninenik.com/content.php?arti_id=579 เป็นแนวทางแทน
ไปที่ Copy
Javascript Code
<script language="javascript" src="js/jquery-1.2.6.min.js"></script> <script type="text/javascript"> function chk_form(){ $(":input + span.require").remove(); $(":input").each(function(){ $(this).each(function(){ if($(this).val()==""){ $(this).after("<span class=require>« จำเป็นต้องกรอก</span>"); } }); }); if($(":input").next().is(".require")==false){ return true; }else{ return false; } } </script>
CSS และ HTML Code
<style type="text/css"> .require{ height:20px; color:#FF0000; padding-left:5px; padding-right:5px; font-size:12px; line-height:15px; width:100px; float:none; } </style> <form id="form1" name="form1" method="post" action="" onsubmit="return chk_form()"> <table width="100%" border="0" cellspacing="3" cellpadding="0"> <tr> <td width="17%" align="right">ชื่อ นามสกุล </td> <td width="83%" align="left"><input name="name" type="text" id="name" /></td> </tr> <tr> <td align="right">อีเมลล์</td> <td align="left"><input name="email" type="text" id="email" /></td> </tr> <tr> <td align="right">เพศ</td> <td align="left"><input name="sex" type="radio" value="ชาย" checked="checked" /> ชาย <input name="sex" type="radio" value="หญิง" /> หญิง</td> </tr> <tr> <td align="right">ที่อยู่</td> <td align="left"><textarea name="address" rows="4" id="address"></textarea></td> </tr> <tr> <td align="right">จังหวัด</td> <td align="left"><select name="province" id="province"> <option value="">เลือกจังหวัด</option> <option value="กรุงเทพ">กรุงเทพ</option> </select> </td> </tr> <tr> <td align="right">รหัสไปรษณีย์</td> <td align="left"><input name="zipcode" type="text" id="zipcode" /></td> </tr> <tr> <td align="right"> </td> <td align="left"><input type="submit" name="Submit" value="Submit" /></td> </tr> <tr> <td> </td> <td align="left"> </td> </tr> </table> </form>
ตัวอย่างผลลัพธ์
กด Like หรือ Share เป็นกำลังใจ ให้มีบทความใหม่ๆ เรื่อยๆ น่ะครับ
URL สำหรับอ้างอิง
Top
Copy
คำแนะนำ และการใช้งาน
สมาชิก กรุณา ล็อกอินเข้าระบบ เพื่อตั้งคำถามใหม่ หรือ ตอบคำถาม สมาชิกใหม่ สมัครสมาชิกได้ที่ สมัครสมาชิก
- ถาม-ตอบ กรุณา ล็อกอินเข้าระบบ
เว็บไซต์ของเราให้บริการเนื้อหาบทความสำหรับนักพัฒนา โดยพึ่งพารายได้เล็กน้อยจากการแสดงโฆษณา
โปรดสนับสนุนเว็บไซต์ของเราด้วยการปิดการใช้งานตัวปิดกั้นโฆษณา (Disable Ads Blocker) ขอบคุณครับ