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,038

HOME > PHP > PHP Forum > อยากได้ code คำนวณค่าจาก sum ค่า textbox แบบอัตโนมัติ โดยใช้ javascript


อยากได้ code คำนวณค่าจาก sum ค่า textbox แบบอัตโนมัติ โดยใช้ javascript

 
Topic : 050621

Guest



อยากได้ code ที่ใช้คำนวณค่าจาก textbox แบบอัตโนมัติ โดยใช้ javascript น่ะค่ะ คือจะคำนวณราคาของสินค้าค่ะ
แบบว่า ราคาของสินค้า * จำนวนชิ้น = จำนวนรวม แล้วก็จะมีช่องสำหรับราคาสุทธิด้วยค่ะ ในกรณีถ้ามีสินค้ามากกว่า 1 รายการน่ะค่ะ
ก็จะเป็น ราคาสุทธิ = ราคารวมของสินค้าชิ้นที่ 1 + ราคารวมของสินค้าชิ้นที่ 2 +....... ไปเรื่อย ๆ จนครบจำนวนสินค้าที่กรอกไปน่ะค่ะ



Tag : PHP, Ms SQL Server 2005, Ms SQL Server 2008, JavaScript
Move To Hilight (Stock) 
Send To Friend.Bookmark.
Date : 2010-10-22 16:37:30 By : นิ View : 60229 Reply : 17
 

 

No. 1



โพสกระทู้ ( 74,059 )
บทความ ( 838 )

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

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

Code เต็มๆ ครับ

Code (JavaScript)
<html>
<head>
<title>ThaiCreate.Com Tutorial</title>
</head>
<body>
<script language="javascript">
function fncCal()
{
	var tot = 0;
	var sum = 0;
	for(i=1;i<=document.form1.hdnLine.value;i++)
	{
		tot = parseInt(eval("document.form1.txtVol1_"+i+".value")) + parseInt(eval("document.form1.txtVol2_"+i+".value"))
		eval("document.form1.txtVol3_"+i+".value="+tot);
		sum = tot + tot;
		document.form1.txtSum.value=sum;
	}
}
</script>
<form action="page.cgi" method="post" name="form1">
Input 1 <input name="txtVol[]" id="txtVol1_1" type="text"> <input name="txtVol[]" id="txtVol2_1" type="text"> =  <input name="txtVol[]" id="txtVol3_1" type="text"><br>
Input 2 <input name="txtVol[]" id="txtVol1_2" type="text"> <input name="txtVol[]" id="txtVol2_2" type="text"> =  <input name="txtVol[]" id="txtVol3_2" type="text"><br>
Input 3 <input name="txtVol[]" id="txtVol1_3" type="text"> <input name="txtVol[]" id="txtVol2_3" type="text"> =  <input name="txtVol[]" id="txtVol3_3" type="text"><br>
Input 4 <input name="txtVol[]" id="txtVol1_4" type="text"> <input name="txtVol[]" id="txtVol2_4" type="text"> =  <input name="txtVol[]" id="txtVol3_4" type="text"><br>
Input 5 <input name="txtVol[]" id="txtVol1_5" type="text"> <input name="txtVol[]" id="txtVol2_5" type="text"> =  <input name="txtVol[]" id="txtVol3_5" type="text"><br>
<input type="hidden" name="hdnLine" value="5">

Summary : <input name="txtSum" id="txtSim" type="text"><br>

<input name="btnCal" type="button" value="Cal" OnClick="JavaScript:fncCal();">
</form>
</body>
</html>



Summary Textbox
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2010-10-22 16:41:24 By : webmaster
 

 

No. 2

Guest


http://www.pors2u.com/
ผมเขียน shopping cart ให้ที่นี่ลองเข้าไปดูครัีบ
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2010-10-22 16:41:50 By : num
 

 

No. 3

Guest


ขอบคุณสำหรับคำตอบนะค่ะ แต่รบกวนถามอีกหน่อยค่ะ ถ้าต้องการให้ค่าในช่อง จำนวนรวมแสดงค่าผลเองโดยไม่ต้องกดปุ่ม จะต้องทำอย่างไงค่ะ แล้วก็ให้ช่องจำนวนสุทธิเปลี่ยนเองเช่นกัน ขอบคุณค่ะ
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2010-10-22 17:02:15 By : นิ
 

 

No. 4

Guest


Code (Js)
<html>
<head>
<title>ThaiCreate.Com Tutorial</title>
</head>
<body>
<form name="frmMain" action="" method="post">
<script language="JavaScript">
	function fncSum()
	{
		 if(isNaN(document.frmMain.txtNumberA.value) || document.frmMain.txtNumberA.value == "")
		 {
			alert('(Number A)Please input Number only.');
			document.frmMain.txtNumberA.focus();
			return;
		 }

		 if(isNaN(document.frmMain.txtNumberB.value) || document.frmMain.txtNumberB.value == "")
		 {
			alert('(Number B)Please input Number only.');
			document.frmMain.txtNumberB.focus();
			return;
		 }

		 document.frmMain.txtNumberC.value = parseFloat(document.frmMain.txtNumberA.value) + parseFloat(document.frmMain.txtNumberB.value);
	}
</script>
Number A <input type="text" name="txtNumberA" value="" OnChange="fncSum();"> <br>
Number B <input type="text" name="txtNumberB" value="" OnChange="fncSum();"> <br>
A + B  = <input type="text" name="txtNumberC" value=""><br>
</form>
</body>
</html>

แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2010-10-22 17:31:56 By : jj
 

 

No. 5

Guest


Code (PHP)
<html>
<head>
<title>ThaiCreate.Com Tutorial</title>
</head>
<body>
<script language="javascript">
function fncCal()
{
	var tot = 0;
	var sum = 0;
	for(i=1;i<=document.form1.hdnLine.value;i++)
	{
		tot = parseInt(eval("document.form1.txtVol1_"+i+".value")) + parseInt(eval("document.form1.txtVol2_"+i+".value"))
		eval("document.form1.txtVol3_"+i+".value="+tot);
		sum = tot + tot;
		document.form1.txtSum.value=sum;
	}
}
</script>
<form action="page.cgi" method="post" name="form1">
Input 1 <input name="txtVol[]" id="txtVol1_1" type="text"> <input name="txtVol[]" id="txtVol2_1" type="text"> =  <input name="txtVol[]" id="txtVol3_1" type="text"><br>
Input 2 <input name="txtVol[]" id="txtVol1_2" type="text"> <input name="txtVol[]" id="txtVol2_2" type="text"> =  <input name="txtVol[]" id="txtVol3_2" type="text"><br>
Input 3 <input name="txtVol[]" id="txtVol1_3" type="text"> <input name="txtVol[]" id="txtVol2_3" type="text"> =  <input name="txtVol[]" id="txtVol3_3" type="text"><br>
Input 4 <input name="txtVol[]" id="txtVol1_4" type="text"> <input name="txtVol[]" id="txtVol2_4" type="text"> =  <input name="txtVol[]" id="txtVol3_4" type="text"><br>
Input 5 <input name="txtVol[]" id="txtVol1_5" type="text"> <input name="txtVol[]" id="txtVol2_5" type="text"> =  <input name="txtVol[]" id="txtVol3_5" type="text"><br>
<input type="hidden" name="hdnLine" value="5">

Summary : <input name="txtSum" id="txtSim" type="text"><br>

<input name="btnCal" type="button" value="Cal" OnClick="JavaScript:fncCal();">
</form>
</body>
</html>


Code ชุดนี้จริงๆผิดนะครับเรื่องคำนวณ

ต้องแก้ในส่วนของ

sum = tot + tot; เป็น sum = tot + sum ;

ครับ ระบบถึงจะคำนวณได้ถูกต้อง

Code (PHP)
<html>
<head>
<title>ThaiCreate.Com Tutorial</title>
</head>
<body>
<script language="javascript">
function fncCal()
{
	var tot = 0;
	var sum = 0;
	for(i=1;i<=document.form1.hdnLine.value;i++)
	{
		tot = parseInt(eval("document.form1.txtVol1_"+i+".value")) + parseInt(eval("document.form1.txtVol2_"+i+".value"))
		eval("document.form1.txtVol3_"+i+".value="+tot);
		sum = tot + sum;
		document.form1.txtSum.value=sum;
	}
}
</script>
<form action="page.cgi" method="post" name="form1">
Input 1 <input name="txtVol[]" id="txtVol1_1" type="text"> <input name="txtVol[]" id="txtVol2_1" type="text"> =  <input name="txtVol[]" id="txtVol3_1" type="text"><br>
Input 2 <input name="txtVol[]" id="txtVol1_2" type="text"> <input name="txtVol[]" id="txtVol2_2" type="text"> =  <input name="txtVol[]" id="txtVol3_2" type="text"><br>
Input 3 <input name="txtVol[]" id="txtVol1_3" type="text"> <input name="txtVol[]" id="txtVol2_3" type="text"> =  <input name="txtVol[]" id="txtVol3_3" type="text"><br>
Input 4 <input name="txtVol[]" id="txtVol1_4" type="text"> <input name="txtVol[]" id="txtVol2_4" type="text"> =  <input name="txtVol[]" id="txtVol3_4" type="text"><br>
Input 5 <input name="txtVol[]" id="txtVol1_5" type="text"> <input name="txtVol[]" id="txtVol2_5" type="text"> =  <input name="txtVol[]" id="txtVol3_5" type="text"><br>
<input type="hidden" name="hdnLine" value="5">

Summary : <input name="txtSum" id="txtSim" type="text"><br>

<input name="btnCal" type="button" value="Cal" OnClick="JavaScript:fncCal();">
</form>
</body>
</html>

แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2011-11-17 14:38:34 By : iaunz
 

 

No. 6

Guest


ตอบความคิดเห็นที่ : 4 เขียนโดย : jj เมื่อวันที่ 2010-10-22 17:31:56
รายละเอียดของการตอบ ::
แล้วถ้ามีหลายแถวละครับ จะเขียนหาค่ารวมและยอดสุทธิได้อย่างไร


ตอบความคิดเห็นที่ : 5 เขียนโดย : iaunz เมื่อวันที่ 2011-11-17 14:38:34
รายละเอียดของการตอบ ::
แล้วถ้าไม่ได้ใส่ค่าลงไปในช่อง จะทำอย่างไรไม่ให้ขึ้น NaN ครับ หรือ จะเขียนอย่างไรตรงไหนให้ค่าว่าง=0


ปล.ผมศึกษาและผสมcodeมาหลายวันแล้วครับ ผมยังไม่เคยเห็นตัวอย่างที่สามารถคำนวณอัตโนมัติทั้งยอดรวมและยอดสุทธิทันทีโดย..ไม่ต้องกดปุ่มคำนวณ และสามารถดักifค่าว่างให้=0ได้เลยครับ

รบกวนด้วยนะครับ ขอบพระคุณอย่างสูง
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2013-06-07 14:47:03 By : ขาจร
 

 

No. 7



โพสกระทู้ ( 1,569 )
บทความ ( 2 )



สถานะออฟไลน์
Twitter Facebook Blogger

ลองของผมดูครับ
ใช้ได้
http://jsfiddle.net/erickub/3T8he/13/
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2013-06-07 16:16:10 By : itpcc
 

 

No. 8

Guest


ตอบความคิดเห็นที่ : 7 เขียนโดย : itpcc เมื่อวันที่ 2013-06-07 16:16:10
รายละเอียดของการตอบ ::
สุดยอดครับ แต่กว่าจะแกะได้ตาลายเลยครับ เขียนเป็นแบบ class กราบขอบพระคุณจริงๆครับ


success
สำเร็จแล้วครับ
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2013-06-07 17:16:22 By : ขาจร
 

 

No. 9



โพสกระทู้ ( 5,149 )
บทความ ( 26 )

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

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


สำเร็จแล้ว ก็ลองเอาโค้ดมาลงไว้ด้วย จะดีมากกว่านี้ครับผม.
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2013-06-07 17:22:21 By : deawx
 

 

No. 10



โพสกระทู้ ( 1,569 )
บทความ ( 2 )



สถานะออฟไลน์
Twitter Facebook Blogger

ตอบความคิดเห็นที่ : 8 เขียนโดย : ขาจร เมื่อวันที่ 2013-06-07 17:16:22
รายละเอียดของการตอบ ::
เออเนอะ ลืมคลาสไปได้ไง
ดีแล้วครับที่ทำได้
อย่าลืมเอาโค๊ดที่สำเร็จแล้วมาแปะนะครับ

แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2013-06-07 17:34:54 By : itpcc
 

 

No. 11

Guest


ขอ flowchart ด้วยได้ปะค่ะ
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2013-07-13 20:07:57 By : ฉัน
 

 

No. 12



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



สถานะออฟไลน์
Twitter Facebook Blogger

แล้วถ้าแบบนี้จะเขียนยังไงค่ะ รบกวนท่านผู้รู้แนะนำหน่อยค่ะ https://docs.google.com/spreadsheets/d/1cDAa9I5OFLlfxaId_R1U0uCk9luyxV6qUxrkIurElLY/edit#gid=1470406024


ประวัติการแก้ไข
2014-07-29 10:36:03
2014-07-29 10:37:00
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2014-07-29 10:35:12 By : TarnNee
 

 

No. 13



โพสกระทู้ ( 4,170 )
บทความ ( 7 )

Hall of Fame 2012

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


ตอบความคิดเห็นที่ : 12 เขียนโดย : TarnNee เมื่อวันที่ 2014-07-29 10:35:12
รายละเอียดของการตอบ ::
แนะนำให้ตั้ง Topic ใหม่จะได้คำตอบได้ง่ายกว่านะครับ
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2014-07-29 10:59:37 By : Ex-[S]i[L]e[N]t
 

 

No. 14



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



สถานะออฟไลน์
Twitter Facebook Blogger

ตอบความคิดเห็นที่ : 13 เขียนโดย : Ex-[S]i[L]e[N]t เมื่อวันที่ 2014-07-29 10:59:37
รายละเอียดของการตอบ ::
อ่อค่ะได้ค่ะ ^_^
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2014-07-29 11:10:01 By : TarnNee
 

 

No. 15



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



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


ตอบความคิดเห็นที่ : 8 เขียนโดย : ขาจร เมื่อวันที่ 2013-06-07 17:16:22
รายละเอียดของการตอบ ::
นำ code มาดูเป็นตัวอย่างหน่อยครับ

แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2014-09-17 08:27:59 By : prateep666
 

 

No. 16

Guest


[font=Verdana][/font]
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2016-10-20 11:02:01 By : [marquee][pre][left][center][h
 

 
ตอบความคิดเห็นที่ : 8 เขียนโดย : ขาจร เมื่อวันที่ 2013-06-07 17:16:22
รายละเอียดของการตอบ ::
... ใส่ความคิดเห็นตรงนี้....... รอ code
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2022-04-08 18:16:35 By : โอ้ย
 

   

ค้นหาข้อมูล
   
 

แสดงความคิดเห็น
Re : อยากได้ code คำนวณค่าจาก sum ค่า textbox แบบอัตโนมัติ โดยใช้ javascript
 
 
รายละเอียด
 
ตัวหนา ตัวเอียง ตัวขีดเส้นใต้ ตัวมีขีดกลาง| ตัวเรืองแสง ตัวมีเงา ตัวอักษรวิ่ง| จัดย่อหน้าอิสระ จัดย่อหน้าชิดซ้าย จัดย่อหน้ากึ่งกลาง จัดย่อหน้าชิดขวา| เส้นขวาง| ขนาดตัวอักษร แบบตัวอักษร
ใส่แฟลช ใส่รูป ใส่ไฮเปอร์ลิ้งค์ ใส่อีเมล์ ใส่ลิ้งค์ 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 (หรือล็อกอินเข้าระบบสมาชิกเพื่อไม่ต้องกรอก)





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