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 > ช่วยทำให้ textbox คูณกันอัตโนมัติหน่อย ติดมาหลายวันแล้วครับ



 

ช่วยทำให้ textbox คูณกันอัตโนมัติหน่อย ติดมาหลายวันแล้วครับ

 



Topic : 120982



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



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




ตารางที่จะให้คูณ


Code (PHP)
<!DOCTYPE html>
<html >
  <head>
    <meta charset="UTF-8">
    <title>New Product</title>       
    
        <link rel="stylesheet" href="css/style.css">
        <script>
		var counter = 1;
		var limit = 10;
		function addInput(divName){
   		  if (counter == limit)  {
      		    alert("You have reached the limit of adding " + counter + " Flavors");
   		  }
     		else {
				
				// Find a <table> element with id="flavortable":
				var table = document.getElementById("flavortable");

				// Create an empty <tr> element and add it to the 1st position of the table:
				var lastRowIndex = table.rows.length-1;
				var row = table.insertRow(lastRowIndex);
				
				// Insert new cells (<td> elements) at the 1st and 2nd position of the "new" <tr> element:
				var cell1 = row.insertCell(0);
				var cell2 = row.insertCell(1);
				
				// Add some text to the new cells:
				cell1.innerHTML = "<input type='text' name='flavor[]'>";
				cell2.innerHTML = "<input type='text' name='barcode[]'>";
        		counter++;
   		  }
		}
		</script>
        
        
         <script>
		var counter2 = 1;
		var limit2 = 10;
		function addInput2(divName){
   		  if (counter2 == limit2)  {
      		    alert("You have reached the limit of adding " + counter2 + " packings");
   		  }
     		else {
				// Find a <table> element with id="myTable":
				var table = document.getElementById("packingtable");

				// Create an empty <tr> element and add it to the 1st position of the table:
				var lastRowIndex = table.rows.length-1;
				var row = table.insertRow(lastRowIndex);

				// Insert new cells (<td> elements) at the 1st and 2nd position of the "new" <tr> element:
				var cell1 = row.insertCell(0);
				var cell2 = row.insertCell(1);
				var cell3 = row.insertCell(2);
				var cell4 = row.insertCell(3);
				var cell5 = row.insertCell(4);
				var cell6 = row.insertCell(5);

				// Add some text to the new cells:
				cell1.innerHTML = "<input type='text' name='packing[]'>";
				cell2.innerHTML = "<input type='text' name='price[]'  style='width: 80px;'>";
				cell3.innerHTML = "<input type='text' name='boxwidth[]' style='width: 35px;'>";
				cell4.innerHTML = "<input type='text' name='boxlength[]' style='width: 35px;'>";
				cell5.innerHTML = "<input type='text' name='boxheight[]' style='width: 35px;'>";
				cell6.innerHTML = "<input type='text' name='boxsize[]' style='width: 40px;'>";
				counter2++;		
   		  }
		}
		</script>


  </head>

  <body>
		
    	<form action="process-newproduct.php" method="post">
		<table class="login_table">

		<tr>
		<td>Product Name [E] <span>*</span></td>
		<td><input type="text" name="productname" placeholder="Product Name [Eng]" required></td>
		</tr>
        
		<tr>
		<td>Product Name [T] <span></span></td>
		<td><input type="text" name="productnameth" placeholder="Product Name [TH]"></td>
		</tr>
        
        <tr>
		<td>Product Description <span></span></td>
		<td><input type="text" name="productdesc"  placeholder="Product Description"></td>
		</tr>
        
        <tr>
		<td>Shelf life <span></span></td>
		<td><input type="text" name="shelflife"  placeholder="i.e 2 years"></td>
		</tr>
        
        <tr>
		<td>Product Category <span>*</span></td>
		<td><?
		$objConnect = mysql_connect("localhost","root","abcd1234") or die("Error Connect to Database");
		mysql_query("SET NAMES UTF8");
		$objDB = mysql_select_db("thaimee");
	
		$query = mysql_query("select * from categary;"); // Run your query

		echo ' <select name="product_CategoryID">'; // Open your drop down box

		// Loop through the query results, outputing the options one by one
		while ($row = mysql_fetch_array($query)) {
   		echo '<option value="'.$row['CategaryID'].'">'.$row['CategaryName'].'</option>';
		}

		echo '</select>';// Close your drop down box
		?></td>
		</tr>
         
        <!-- For flavor -->
        <table id="flavortable">
        <tr>
		<td>Flavor</td>
        <td>Barcode</td>
		</tr>
        
        <tr>
        <td><input type="text" name="flavor[]"  placeholder="i.e Strawberry" ></td>
        <td><input type="text" name="barcode[]"  placeholder="i.e 8 853115 007783"></td>
        </tr>
        
        <tr>
        <td><input type="button" class="button" value="Add another Flavor" onClick="addInput('flavortable');"></td>
		</tr>
        </table>
        
        
        <!-- For packing -->
        <table id="packingtable">
    	<tr>    
        <td>Packing </td>
        <td>Price  </td>
        <td>W(cm)  </td>
        <td>L(cm) </td>
        <td>H(cm) </td>
        <td>BoxSize  </td>
    	</tr>
    
    	<tr>
        <td><input type="text" name="packing[]" placeholder="i.e 110 g x 60"></td>
        <td><input type="text" name="price[]" placeholder="i.e 550" style="width: 80px;"></td>
        <td><input type="text" name="boxwidth[]" placeholder="30" style="width: 35px;" ></td>
        <td><input type="text" name="boxlength[]" placeholder="40" style="width: 35px;" ></td>
        <td><input type="text" name="boxheight[]" placeholder="20" style="width: 35px;" ></td>
        <td><input type="text" name="boxsize[]" style="width: 40px;" ></td>
    	</tr>
        
        <tr>
    	<td><input type="button" class="button" value="Add another Packing" onClick="addInput2('packingtable');"></td>
    	</tr>
		</table>

  
		<tr>
		<td><input type="submit" class="submitbutton" value="Save" ></td>
		</tr>
		</table>
	</form>
  

    
    
  </body>
</html>




Tag : PHP, HTML/CSS, JavaScript







Move To Hilight (Stock) 
Send To Friend.Bookmark.
Date : 2016-01-20 15:11:51 By : athiwatbuun View : 923 Reply : 6
 

 

No. 1



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



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

หา boxsize ?






แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2016-01-20 16:01:18 By : progamer2000
 


 

No. 2



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



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


ตอบความคิดเห็นที่ : 1 เขียนโดย : progamer2000 เมื่อวันที่ 2016-01-20 16:01:18
รายละเอียดของการตอบ ::
ช่ายครับ ทำไม่ได้ซักที


แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2016-01-20 16:02:42 By : athiwatbuun
 

 

No. 3



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



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

ขอออภัยผมเขียน javascript แบบนั้นไม่เป็น ช่วยได้แต่แบบ jquery นะครับ

Code (PHP)
<!DOCTYPE html>
<html >
  <head>
    <meta charset="UTF-8">
    <title>New Product</title>       

    <link rel="stylesheet" href="css/style.css">



  </head>

  <body>

    <form action="process-newproduct.php" method="post">
      <table class="login_table">

        <tr>
          <td>Product Name [E] <span>*</span></td>
          <td><input type="text" name="productname" placeholder="Product Name [Eng]" required></td>
        </tr>

        <tr>
          <td>Product Name [T] <span></span></td>
          <td><input type="text" name="productnameth" placeholder="Product Name [TH]"></td>
        </tr>

        <tr>
          <td>Product Description <span></span></td>
          <td><input type="text" name="productdesc"  placeholder="Product Description"></td>
        </tr>

        <tr>
          <td>Shelf life <span></span></td>
          <td><input type="text" name="shelflife"  placeholder="i.e 2 years"></td>
        </tr>

        <tr>
          <td>Product Category <span>*</span></td>
          <td>
          </td>
        </tr>

        <!-- For flavor -->
        <table id="flavortable">
          <tr>
            <td>Flavor</td>
            <td>Barcode</td>
          </tr>

          <tr>
            <td><input type="text" name="flavor[]"  placeholder="i.e Strawberry" ></td>
            <td><input type="text" name="barcode[]"  placeholder="i.e 8 853115 007783"></td>
          </tr>

          <tr>
            <td><input type="button" class="button" value="Add another Flavor" onClick="addInput('flavortable');"></td>
          </tr>
        </table>


        <!-- For packing -->
        <table id="packingtable">
          <tr>    
            <td>Packing </td>
            <td>Price  </td>
            <td>W(cm)  </td>
            <td>L(cm) </td>
            <td>H(cm) </td>
            <td>BoxSize  </td>
          </tr>

          <tr>
            <td><input type="text" name="packing[]" placeholder="i.e 110 g x 60"></td>
            <td><input type="text" name="price[]" placeholder="i.e 550" style="width: 80px;"></td>
            <td><input type="text" name="boxwidth[]" class="boxwidth" placeholder="30" style="width: 35px;" ></td>
            <td><input type="text" name="boxlength[]" class="boxleghth" placeholder="40" style="width: 35px;" ></td>
            <td><input type="text" name="boxheight[]" class="boxheight" placeholder="20" style="width: 35px;" ></td>
            <td><input type="text" name="boxsize[]" class="boxsize" style="width: 40px;" ></td>
          </tr>

          <tr>
            <td><input type="button" class="button" value="Add another Packing" onClick="addInput2('packingtable');"></td>
          </tr>
        </table>


        <tr>
          <td><input type="submit" class="submitbutton" value="Save" ></td>
        </tr>
      </table>
    </form>


    <script src="//code.jquery.com/jquery-1.12.0.min.js"></script>
    <script>
      var counter = 1;
      var limit = 10;
      function addInput(divName){
        if (counter == limit)  {
          alert("You have reached the limit of adding " + counter + " Flavors");
        }
        else {
				
          // Find a <table> element with id="flavortable":
          var table = document.getElementById("flavortable");

          // Create an empty <tr> element and add it to the 1st position of the table:
          var lastRowIndex = table.rows.length-1;
          var row = table.insertRow(lastRowIndex);
				
          // Insert new cells (<td> elements) at the 1st and 2nd position of the "new" <tr> element:
          var cell1 = row.insertCell(0);
          var cell2 = row.insertCell(1);
				
          // Add some text to the new cells:
          cell1.innerHTML = "<input type='text' name='flavor[]'>";
          cell2.innerHTML = "<input type='text' name='barcode[]'>";
          counter++;
        }
      }

      var counter2 = 1;
      var limit2 = 10;
      function addInput2(divName){
        if (counter2 == limit2)  {
          alert("You have reached the limit of adding " + counter2 + " packings");
        }
        else {
          // Find a <table> element with id="myTable":
          var table = document.getElementById("packingtable");

          // Create an empty <tr> element and add it to the 1st position of the table:
          var lastRowIndex = table.rows.length-1;
          var row = table.insertRow(lastRowIndex);

          // Insert new cells (<td> elements) at the 1st and 2nd position of the "new" <tr> element:
          var cell1 = row.insertCell(0);
          var cell2 = row.insertCell(1);
          var cell3 = row.insertCell(2);
          var cell4 = row.insertCell(3);
          var cell5 = row.insertCell(4);
          var cell6 = row.insertCell(5);

          // Add some text to the new cells:
          cell1.innerHTML = "<input type='text' name='packing[]'>";
          cell2.innerHTML = "<input type='text' name='price[]'  style='width: 80px;'>";
          cell3.innerHTML = "<input type='text' name='boxwidth[]' class='boxwidth' style='width: 35px;'>";
          cell4.innerHTML = "<input type='text' name='boxlength[]' class='boxlength' style='width: 35px;'>";
          cell5.innerHTML = "<input type='text' name='boxheight[]' class='boxheight' style='width: 35px;'>";
          cell6.innerHTML = "<input type='text' name='boxsize[]' class='boxsize' style='width: 40px;'>";
          counter2++;		
        }
      }
      
      $('input').parents('tr').each(function(){
      $(this).on('keyup',function(){
        var w = $(this).find('.boxwidth').val()?$(this).find('.boxwidth').val():0;
        var l = $(this).find('.boxleghth').val()?$(this).find('.boxleghth').val():0;
        var h = $(this).find('.boxheight').val()?$(this).find('.boxheight').val():0;
        var s = parseFloat(w) * parseFloat(l) * parseFloat(h);
        $(this).find('.boxsize').val(s);
      });
        
      });
    </script>
  </body>
</html>

แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2016-01-20 16:16:41 By : progamer2000
 


 

No. 4



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



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


ตอบความคิดเห็นที่ : 3 เขียนโดย : progamer2000 เมื่อวันที่ 2016-01-20 16:16:41
รายละเอียดของการตอบ ::
ขอบคุณมากนะครับ ขอถามอีกนิดนะครับ พอดีผมรันแล้ว พอเพิ่ม textbox แล้ว textbox อันต่อมาไม่ยอมคำนวนอะครับ

อันที่ 2 ไม่คำนวนอะครับ

แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2016-01-20 16:30:23 By : athiwatbuun
 


 

No. 5



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



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

Code (PHP)
<!DOCTYPE html>
<html >
  <head>
    <meta charset="UTF-8">
    <title>New Product</title>       

    <link rel="stylesheet" href="css/style.css">



  </head>

  <body>

    <form action="process-newproduct.php" method="post">
      <table class="login_table">

        <tr>
          <td>Product Name [E] <span>*</span></td>
          <td><input type="text" name="productname" placeholder="Product Name [Eng]" required></td>
        </tr>

        <tr>
          <td>Product Name [T] <span></span></td>
          <td><input type="text" name="productnameth" placeholder="Product Name [TH]"></td>
        </tr>

        <tr>
          <td>Product Description <span></span></td>
          <td><input type="text" name="productdesc"  placeholder="Product Description"></td>
        </tr>

        <tr>
          <td>Shelf life <span></span></td>
          <td><input type="text" name="shelflife"  placeholder="i.e 2 years"></td>
        </tr>

        <tr>
          <td>Product Category <span>*</span></td>
          <td>
          </td>
        </tr>

        <!-- For flavor -->
        <table id="flavortable">
          <tr>
            <td>Flavor</td>
            <td>Barcode</td>
          </tr>

          <tr>
            <td><input type="text" name="flavor[]"  placeholder="i.e Strawberry" ></td>
            <td><input type="text" name="barcode[]"  placeholder="i.e 8 853115 007783"></td>
          </tr>

          <tr>
            <td><input type="button" class="button" value="Add another Flavor" onClick="addInput('flavortable');"></td>
          </tr>
        </table>


        <!-- For packing -->
        <table id="packingtable">
          <tr>    
            <td>Packing </td>
            <td>Price  </td>
            <td>W(cm)  </td>
            <td>L(cm) </td>
            <td>H(cm) </td>
            <td>BoxSize  </td>
          </tr>

          <tr>
            <td><input type="text" name="packing[]" placeholder="i.e 110 g x 60"></td>
            <td><input type="text" name="price[]" placeholder="i.e 550" style="width: 80px;"></td>
            <td><input type="text" name="boxwidth[]" class="boxwidth" placeholder="30" style="width: 35px;" ></td>
            <td><input type="text" name="boxlength[]" class="boxlength" placeholder="40" style="width: 35px;" ></td>
            <td><input type="text" name="boxheight[]" class="boxheight" placeholder="20" style="width: 35px;" ></td>
            <td><input type="text" name="boxsize[]" class="boxsize" style="width: 40px;" ></td>
          </tr>

          <tr>
            <td><input type="button" class="button" value="Add another Packing" onClick="addInput2('packingtable');"></td>
          </tr>
        </table>


        <tr>
          <td><input type="submit" class="submitbutton" value="Save" ></td>
        </tr>
      </table>
    </form>


    <script src="//code.jquery.com/jquery-1.12.0.min.js"></script>
    <script>
      var counter = 1;
      var limit = 10;
      function addInput(divName){
        if (counter == limit)  {
          alert("You have reached the limit of adding " + counter + " Flavors");
        }
        else {
				
          // Find a <table> element with id="flavortable":
          var table = document.getElementById("flavortable");

          // Create an empty <tr> element and add it to the 1st position of the table:
          var lastRowIndex = table.rows.length-1;
          var row = table.insertRow(lastRowIndex);
				
          // Insert new cells (<td> elements) at the 1st and 2nd position of the "new" <tr> element:
          var cell1 = row.insertCell(0);
          var cell2 = row.insertCell(1);
				
          // Add some text to the new cells:
          cell1.innerHTML = "<input type='text' name='flavor[]'>";
          cell2.innerHTML = "<input type='text' name='barcode[]'>";
          counter++;
        }
      }

      var counter2 = 1;
      var limit2 = 10;
      function addInput2(divName){
        if (counter2 == limit2)  {
          alert("You have reached the limit of adding " + counter2 + " packings");
        }
        else {
          // Find a <table> element with id="myTable":
          var table = document.getElementById("packingtable");

          // Create an empty <tr> element and add it to the 1st position of the table:
          var lastRowIndex = table.rows.length-1;
          var row = table.insertRow(lastRowIndex);

          // Insert new cells (<td> elements) at the 1st and 2nd position of the "new" <tr> element:
          var cell1 = row.insertCell(0);
          var cell2 = row.insertCell(1);
          var cell3 = row.insertCell(2);
          var cell4 = row.insertCell(3);
          var cell5 = row.insertCell(4);
          var cell6 = row.insertCell(5);

          // Add some text to the new cells:
          cell1.innerHTML = "<input type='text' name='packing[]'>";
          cell2.innerHTML = "<input type='text' name='price[]'  style='width: 80px;'>";
          cell3.innerHTML = "<input type='text' name='boxwidth[]' class='boxwidth' style='width: 35px;'>";
          cell4.innerHTML = "<input type='text' name='boxlength[]' class='boxlength' style='width: 35px;'>";
          cell5.innerHTML = "<input type='text' name='boxheight[]' class='boxheight' style='width: 35px;'>";
          cell6.innerHTML = "<input type='text' name='boxsize[]' class='boxsize' style='width: 40px;'>";
          counter2++;		
          Cal();
        }
      }
      function Cal(){
        $('input').parents('tr').each(function(){
          $(this).on('keyup',function(){
            var w = $(this).find('.boxwidth').val()?$(this).find('.boxwidth').val():0;
            var l = $(this).find('.boxlength').val()?$(this).find('.boxlength').val():0;
            var h = $(this).find('.boxheight').val()?$(this).find('.boxheight').val():0;
            var s = parseFloat(w) * parseFloat(l) * parseFloat(h);
            $(this).find('.boxsize').val(s);
          });
        
        });
      }
      
      $( document ).ready(function() {
        Cal();
      });
      
    </script>
  </body>
</html>

แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2016-01-20 16:51:15 By : progamer2000
 


 

No. 6



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



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


ตอบความคิดเห็นที่ : 5 เขียนโดย : progamer2000 เมื่อวันที่ 2016-01-20 16:51:15
รายละเอียดของการตอบ ::
ขอบคุณมากนะครับ

แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2016-01-20 17:00:56 By : athiwatbuun
 

   

ค้นหาข้อมูล


   
 

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