ถ้ากรอกเลข 5 ตรง SELECT OPTION ก็จะแสดง 9 ถ้ากรอก 10 ก็จะแสดง 13 ใช้คำสั่งอะไรครับ

ถาม-ตอบ แนะนำไอเดียว โค้ดตัวอย่าง แนวทาง วิธีแก้ปัญหา ถ้ากรอกเลข 5 ตรง SELECT OPTION ก็จะแสดง 9 ถ้ากรอก 10 ก็จะแสดง 13 ใช้คำสั่งอะไรครับ

ถ้ากรอกเลข 5 ตรง SELECT OPTION ก็จะแสดง 9 ถ้ากรอก 10 ก็จะแสดง 13 ใช้คำสั่งอะไรครับ
ประมาณว่าผมกรอกตัวเลข 1 - 9 ใน input   ส่วนของ SELECT OPTION  ก็จะโชว์ 9  ถ้ามากกว่า 9 ก็จะแสดง 15 เป็นแบบ SELECT OPTION


Sun Yuttakarn 23-06-2016 12:15:05

คำแนะนำ และการใช้งาน

สมาชิก กรุณา ล็อกอินเข้าระบบ เพื่อตั้งคำถามใหม่ หรือ ตอบคำถาม สมาชิกใหม่ สมัครสมาชิกได้ที่ สมัครสมาชิก


  • ถาม-ตอบ กรุณา ล็อกอินเข้าระบบ
  • เปลี่ยน


    ( หรือ เข้าใช้งานผ่าน Social Login )

 ความคิดเห็นที่ 1


ninenik 23-06-2016
 ความคิดเห็นที่ 2

ผมไม่เขาใจที่อาจารย์บอกเหมือนกันครับ เขาบอกว่า ให้กำหนดว่าถ้ากรอกจำนวน 1- 9 ก็จะให้แสดงตัวเลือกของ รถตู้ขนาด 9 ที่นั่งมา

แต่ถ้ากรอกมากกว่า 9 ก็จะแสดงขนาด 13 ที่นั่ง ซึ่งตอนแรกผมใส่แบบกรอก 9 ก็เก็บจำนวน 9 และก็แค่แสดง SLELECT OPTION แบบธรรมดา ที่ดึงมาจากฐานข้อมูล 9 กับ 13 แต่นี้อจารย์ให้ทำแบบนั้นครับ



Sun Yuttakarn 23-06-2016 13:35
 ความคิดเห็นที่ 3
ลองศึกษาพวก jquery เพิ่มเติมจะได้ไอเดีย http://api.jquery.com/
 
สมมติ ต้องการสองสิ่งสัมพันธ์กัน

<div class="container" style="width:300px;margin:auto;">
<input type="text" name="data_a" id="data_a" value="" class="form-control"><br>
<select name="data_b" id="data_b" class="form-control">
	<option value=""> Select </option>
	<option value="1">1</option>    
	<option value="2">2</option>
	<option value="3">3</option>        
</select>
</div>

 
a กับ b
a เป้น input
b เป็น select
 
เหตุการณ์ a เปลี่ยน แล้ว b เปลี่ยน
a เปลี่ยนเมื่อ keyup แล้ว b เปลี่ยน
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>    
<script type="text/javascript">  
$(function(){  

	var obj_a = $("#data_a");
	var obj_b = $("#data_b");
	
	// a เปลี่ยนเมื่อ keyup แล้ว b เปลี่ยน
	obj_a.on("keyup",function(){
		obj_b.val(3); // เปลี่ยนค่า b เป้น 3		
	});

	
});
</script>





a เปลี่ยนเมื่อ keyup แล้ว b เปลี่ยน ตามเงื่อนไขค่า a
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>    
<script type="text/javascript">  
$(function(){  

	var obj_a = $("#data_a");
	var obj_b = $("#data_b");
	
	// a เปลี่ยนเมื่อ keyup แล้ว b เปลี่ยน ตามเงื่อนไขค่า a
	obj_a.on("keyup",function(){
		var value_obj_a = parseInt($(this).val()); // เก็บค่า a ไว้ในตัวแปร  (parseInt คือเปลงเป็นเลข)
		if(value_obj_a>5){ // กำหนดเงื่อนไขให้กับค่า a
			obj_b.val(3); // เปลี่ยนค่า b เป้น 3			
		}else{
			obj_b.val(1); // เปลี่ยนค่า b เป็น 1						
		}
	});	

});
</script>



 
เหตุการณ์ b เปลี่ยน แล้ว a เปลี่ยน
b เปลี่ยนเมื่อ change แล้ว a เปลี่ยน
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>    
<script type="text/javascript">  
$(function(){  

	var obj_a = $("#data_a");
	var obj_b = $("#data_b");
	
	// b เปลี่ยนเมื่อ change แล้ว a เปลี่ยน
	obj_b.on("change",function(){
		obj_a.val(''); // เปลี่ยนค่า a เป็นค่าว่าง		
	});		
	
	
});
</script>





b เปลี่ยนเมื่อ change แล้ว a เปลี่ยน ตามเงื่อนไขค่า b
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>    
<script type="text/javascript">  
$(function(){  

	var obj_a = $("#data_a");
	var obj_b = $("#data_b");
	
	
	// b เปลี่ยนเมื่อ change แล้ว a เปลี่ยน ตามเงื่อนไขค่า b	
	obj_b.on("change",function(){
		var value_obj_b = parseInt($(this).val()); // เก็บค่า b ไว้ในตัวแปร  (parseInt คือเปลงเป็นเลข)
		if(value_obj_b>0){ // กำหนดเงื่อนไขให้กับค่า b
			obj_a.val(value_obj_b); // เปลี่ยนค่า a เป้น่ค่า b จากตัวแปร value_obj_b 					
		}else{
			obj_a.val('');	 // เปลี่ยนค่า a เป็นค่าว่าง					
		}
	});		
	
});
</script>





 


ninenik 23-06-2016
 ความคิดเห็นที่ 4
ได้แล้วครับขอบพระคุณมากครับ


awordmart 23-06-2016 21:05
1






เว็บไซต์ของเราให้บริการเนื้อหาบทความสำหรับนักพัฒนา โดยพึ่งพารายได้เล็กน้อยจากการแสดงโฆษณา โปรดสนับสนุนเว็บไซต์ของเราด้วยการปิดการใช้งานตัวปิดกั้นโฆษณา (Disable Ads Blocker) ขอบคุณครับ