Register Register Member Login Member Login Member Login Forgot Password ??
PHP , ASP , ASP.NET, VB.NET, C#, Java , jQuery , Android , iOS , Windows Phone
 

Registered : 109,027

HOME > PHP > PHP Forum > jquery เช็คค่าใน form ก่อน submit หน่อยครับ รายละเอียดด้านในครับ



 

jquery เช็คค่าใน form ก่อน submit หน่อยครับ รายละเอียดด้านในครับ

 



Topic : 091131



โพสกระทู้ ( 80 )
บทความ ( 0 )



สถานะออฟไลน์




ขอบเขต คือจะเช็คค่าใน form ก่อนให้กด submit โดยภายใน form จะมี textfieldและ list/menu ต้องทำการให้ครบก่อน button ถึงจะ enable ถ้ากรอกไม่ครบ button จะ disble ครับ เมื่อผม run ดู กรอกข้อมูง ฟิว1 กับ ฟิว 2 button มันก้โชวืแล้วอ่ะครับ ยังไม่ได้ กรอกข้อมูล select เลยครับโชว์ก่อนซะงั้น ผมมือใหม่อยากลองใช้ jquery ดูครับเห็นมันทำอะไรได้เยอะ รบกวนช่วยหน่อยนะครับ 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
  <title></title>
  <meta name="Generator" content="EditPlus">
  <meta name="Author" content="Unidentifier">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
  <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;
	}
  </style>
  <script type="text/javascript">
  <!--
	$(document).ready(function(){
		$("input[type='submit']").attr({"disabled":"disabled"});
		$("input[type='text']").keyup(function(){
			var checkVal = true;
			$("#select option:selected").each(function(){
				if($(this).val()=="1") 
					checkVal &= false;
			});
			$("#txt1").each(function(){
				if($(this).val().length == 0) 
					checkVal &= false;
			});
			$("#txt2").each(function(){
				if($(this).val().length == 0) 
					checkVal &= false;
			});			
			
			if(checkVal) $("input[type='submit']").removeAttr("disabled");
			else $("input[type='submit']").attr({"disabled":"disabled"});
		});
	});
  //-->
  </script>
 </head>

 <body>
	<form method="post" action="">
	<input type="text" name="" id="txt1"> 
	<input type="text" name="" id="txt2">
	<select name="select" id="select">
	  <option value="1" selected></option>
	  <option>1</option>
	  <option>2</option>
	  <option>3</option>
	  <option>4</option>
	  </select> 
	<input type="submit" />
	</form>
 </body>
</html>




Tag : PHP






Move To Hilight (Stock) 
Send To Friend.Bookmark.
Date : 2013-02-19 22:39:08 By : saravutpt View : 3572 Reply : 2
 

 

No. 1



โพสกระทู้ ( 3,155 )
บทความ ( 0 )

สมาชิกที่ใส่เสื้อไทยครีเอท Hall of Fame 2012

สถานะออฟไลน์


ไม่จำเป็นต้องซ่อนปุ่ม submit ทุกกรณีก็ได้นี่ครับ ลองดูโค้ดที่เคยให้ไปอีกที
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
  <title> สอบถามเรื่อง button กับ javascript ใน php ครับ มันสามารถทำได้หรือไม่ครับ รายละเอียดด้านในครับ  </title>
  <meta name="Generator" content="EditPlus">
  <meta name="Author" content="Unidentifier">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
  <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.attr({"disabled":"disabled"});

		$(allInput).keyup(function(){
			var checkVal = true;
			$(allInput).each(function(index){
				if(index> 1 && index <5 && !$(this).val()){ 
					checkVal &= false;					
					return checkVal;
				}
			});

			$("input[type='submit']").prop({"disabled":!checkVal});
		})

		submitBTN.click(function(e){
			e.preventDefault();
			var checkVal = true;
			var selectionBox = $("select.required");
			$(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)//.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>
 </head>

 <body>
	<form method="post" action="new.php" id="formEntry">
	<input type="text" name="" required="1" /><span class="hide">please name</span><br /><br />
	<input type="text" name="" required="1" /><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">กรุณาเลือกเพศด้วยค่ะ</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>
 </body>
</html>






แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2013-02-19 22:50:25 By : sakuraei
 


 

No. 2



โพสกระทู้ ( 80 )
บทความ ( 0 )



สถานะออฟไลน์


ขอบคุณครับ เดี๋ยวลองตรวจเช็คดูอีกรอบครับ
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2013-02-20 08:11:53 By : saravutpt
 

   

ค้นหาข้อมูล
   
 

แสดงความคิดเห็น
Re : jquery เช็คค่าใน form ก่อน submit หน่อยครับ รายละเอียดด้านในครับ
 
 
รายละเอียด
 
ตัวหนา ตัวเอียง ตัวขีดเส้นใต้ ตัวมีขีดกลาง| ตัวเรืองแสง ตัวมีเงา ตัวอักษรวิ่ง| จัดย่อหน้าอิสระ จัดย่อหน้าชิดซ้าย จัดย่อหน้ากึ่งกลาง จัดย่อหน้าชิดขวา| เส้นขวาง| ขนาดตัวอักษร แบบตัวอักษร
ใส่แฟลช ใส่รูป ใส่ไฮเปอร์ลิ้งค์ ใส่อีเมล์ ใส่ลิ้งค์ FTP| ใส่แถวของตาราง ใส่คอลัมน์ตาราง| ตัวยก ตัวห้อย ตัวพิมพ์ดีด| ใส่โค้ด ใส่การอ้างถึงคำพูด| ใส่ลีสต์
smiley for :lol: smiley for :ken: smiley for :D smiley for :) smiley for ;) smiley for :eek: smiley for :geek: smiley for :roll: smiley for :erm: smiley for :cool: smiley for :blank: smiley for :idea: smiley for :ehh: smiley for :aargh: smiley for :evil:
Insert PHP Code
Insert ASP Code
 Insert VB.NET Code Insert C#.NET Code Insert JavaScript Code Insert C#.NET Code
Insert Java Code
Insert Android Code
Insert Objective-C Code
Insert XML Code
Insert SQL Code
Insert Code
เพื่อความเรียบร้อยของข้อความ ควรจัดรูปแบบให้พอดีกับขนาดของหน้าจอ เพื่อง่ายต่อการอ่านและสบายตา และตรวจสอบภาษาไทยให้ถูกต้อง

อัพโหลดแทรกรูปภาพ

Notice

เพื่อความปลอดภัยของเว็บบอร์ด ไม่อนุญาติให้แทรก แท็ก [img]....[/img] โดยการอัพโหลดไฟล์รูปจากที่อื่น เช่นเว็บไซต์ ฟรีอัพโหลดต่าง ๆ
อัพโหลดแทรกรูปภาพ ให้ใช้บริการอัพโหลดไฟล์ของไทยครีเอท และตัดรูปภาพให้พอดีกับสกรีน เพื่อความโหลดเร็วและไฟล์ไม่ถูกลบทิ้ง

   
  เพื่อความปลอดภัยและการตรวจสอบ กระทู้ที่แทรกไฟล์อัพโหลดไฟล์จากที่อื่น อาจจะถูกลบทิ้ง
 
โดย
อีเมล์
บวกค่าให้ถูก
<= ตัวเลขฮินดูอารบิก เช่น 123 (หรือล็อกอินเข้าระบบสมาชิกเพื่อไม่ต้องกรอก)







Exchange: นำเข้าสินค้าจากจีน, Taobao, เฟอร์นิเจอร์, ของพรีเมี่ยม, ร่ม, ปากกา, power bank, แฟลชไดร์ฟ, กระบอกน้ำ

Load balance : Server 04
ThaiCreate.Com Logo
© www.ThaiCreate.Com. 2003-2024 All Rights Reserved.
ไทยครีเอทบริการ จัดทำดูแลแก้ไข Web Application ทุกรูปแบบ (PHP, .Net Application, VB.Net, C#)
[Conditions Privacy Statement] ติดต่อโฆษณา 081-987-6107 อัตราราคา คลิกที่นี่