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 > Java Script การเพิ่ม TextBox มี Button สำหรับเพิ่มจำนวน TextBox คือหากต้องการเพิ่ม TextBox



 

Java Script การเพิ่ม TextBox มี Button สำหรับเพิ่มจำนวน TextBox คือหากต้องการเพิ่ม TextBox

 



Topic : 002630

Guest




มี Button สำหรับเพิ่มจำนวน TextBox คือหากต้องการเพิ่ม TextBox ก็คลิกปุ่ม "เพิ่ม"
หากต้องการลบ TextBox ที่เพิ่มออก ก็ให้คลิก checkbox ที่เพิ่มพร้อมกับ TextBox แล้วคลิกปุ่ม "ลบ"

ประมาณนี้แหละครับ พอจะมีตัวอย่างไหมครับ

หรือมีวิธีแนะนำการเพิ่มข้อมูลไหมครับ เช่น
จะเพิ่มข้อมูล "มูลนิธิ" ซึ่ง 1 มูลนิธิ เป็นได้หลายประเภท จะออกแบบฟอร์การเพิ่มข้อมูลยังไงครับ

พอจะเข้าใจไหมครับ




Tag : - - - -







Move To Hilight (Stock) 
Send To Friend.Bookmark.
Date : 24 ม.ค. 2548 11:26:28 By : tum024 View : 28178 Reply : 22
 

 

No. 1

Guest


Select






Date : 24 ม.ค. 2548 15:17:53 By : shakid
 


 

No. 2



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

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

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

Code
<html>
<head>
<title>ThaiCreate.Com Ajax Tutorial</title>
</head>
<script language="javascript">
function fncCreateElement(){

var mySpan = document.getElementById('mySpan');

var myElement1 = document.createElement('<input type="text" name="txt[]">');
myElement1.setAttribute('id',"txt1");
mySpan.appendChild(myElement1);

//*** Remove Element ***//
/*
var deleteEle = document.getElementById('txt1');
mySpan.removeChild(deleteEle);
*/

var myElement2 = document.createElement('<br>');
mySpan.appendChild(myElement2);
}
</script>
<body>
<span id="mySpan"></span>
<input name="btnButton" id="btnButton" type="button" value="Create" onClick="JavaScript:fncCreateElement();">
</body>
</html>








วันนี้ใจดีเขียนให้อีกแล้วครับ


Code (JavaScript)
<html>
<head>
<title>ThaiCreate.Com JavaScript Add/Remove Element</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<script language="javascript">
	function CreateNewRow()
	{
		var intLine = parseInt(document.frmMain.hdnMaxLine.value);
		intLine++;
			
		var theTable = document.all.tbExp
		var newRow = theTable.insertRow(theTable.rows.length)
		newRow.id = newRow.uniqueID
		
		var item1 = 1
		var newCell
		
		//*** Column 1 ***//
		newCell = newRow.insertCell(0)
		newCell.id = newCell.uniqueID
		newCell.setAttribute("className", "css-name");
		newCell.innerHTML = "<center><INPUT TYPE=\"TEXT\" SIZE=\"5\" NAME=\"Column1_"+intLine+"\" VALUE=\"\"></center>"

		//*** Column 2 ***//
		newCell = newRow.insertCell(1)
		newCell.id = newCell.uniqueID
		newCell.setAttribute("className", "css-name");
		newCell.innerHTML = "<center><INPUT TYPE=\"TEXT\" SIZE=\"5\" NAME=\"Column2_"+intLine+"\" VALUE=\"\"></center>"		
		
		//*** Column 3 ***//
		newCell = newRow.insertCell(2)
		newCell.id = newCell.uniqueID
		newCell.setAttribute("className", "css-name");
		newCell.innerHTML = "<center><INPUT TYPE=\"TEXT\" SIZE=\"5\" NAME=\"Column3_"+intLine+"\" VALUE=\"\"></center>"				
		
		//*** Column 4 ***//
		newCell = newRow.insertCell(3)
		newCell.id = newCell.uniqueID
		newCell.setAttribute("className", "css-name");
		newCell.innerHTML = "<center><INPUT TYPE=\"TEXT\" SIZE=\"5\" NAME=\"Column4_"+intLine+"\" VALUE=\"\"></center>"		
		
		//*** Column 5 ***//
		newCell = newRow.insertCell(4)
		newCell.id = newCell.uniqueID
		newCell.setAttribute("className", "css-name");
		newCell.innerHTML = "<center><INPUT TYPE=\"TEXT\" SIZE=\"5\" NAME=\"Column5_"+intLine+"\" VALUE=\"\"></center>"			
		
		document.frmMain.hdnMaxLine.value = intLine;
	}
	
	function RemoveRow()
	{
		intLine = parseInt(document.frmMain.hdnMaxLine.value);
		if(parseInt(intLine) > 0)
		{
				theTable = (document.all) ? document.all.tbExp : 
				document.getElementById("tbExp")
				theTableBody = theTable.tBodies[0];
				theTableBody.deleteRow(intLine);
				intLine--;
				document.frmMain.hdnMaxLine.value = intLine;
		}	
	}	
</script>
<body>
<form name="frmMain" method="post">
<table width="445" border="1" id="tbExp">
  <tr>
    <td><div align="center">Column 1 </div></td>
    <td><div align="center">Column 2 </div></td>
    <td><div align="center">Column 3 </div></td>
    <td><div align="center">Column 4 </div></td>
    <td><div align="center">Column 5 </div></td>
  </tr>
</table>
<input type="hidden" name="hdnMaxLine" value="0">
<input name="btnAdd" type="button" id="btnAdd" value="+" onClick="CreateNewRow();">
<input name="btnDel" type="button" id="btnDel" value="-" onClick="RemoveRow();">
</form>
</body>
</html>


Screenshot


JavaScript Add/Remove Element
Date : 2009-04-26 09:13:47 By : webmaster
 

 

No. 3

Guest



Date : 2010-10-26 19:22:15 By : เจ้าชายนิรนาม
 


 

No. 4



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



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


มีตัวที่ใช้กับ firefoxได้มั้ยคะ
Date : 2011-10-27 11:05:22 By : goigy
 


 

No. 5

Guest


แล้วเวลาจะเอาค่าที่กรอก ไปแอด ลง ฐานข้อมูล ทำไงครับ เอาค่าไหนไปใช้บ้างครับ
Date : 2011-11-11 16:11:32 By : pongit50
 


 

No. 6



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



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


สังเกตดูตรง element ทุกตัวจะถูกใส่ name ที่แตกต่างกันทุกครั้งที่ create เพราะฉะนั้นเราสามารถอ้าง name ของ element ต่างๆได้ครับ
เราก็แค่ loop เอา value ของทุกๆ element มาใช้งานเท่านั้นครับ....

สังเกตที่

Code (PHP)
newCell.innerHTML = ...............................

Date : 2011-11-11 16:20:04 By : Songkram
 


 

No. 7

Guest


คุณคนที่สองค่ะ ขอคำสั่ง sql ที่ใช้ในการ insert ข้อมุลลงฐานด้วยค่ะ
Date : 2011-12-15 15:46:53 By : soon
 


 

No. 8



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

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

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

Quote:
คุณคนที่สองค่ะ ขอคำสั่ง sql ที่ใช้ในการ insert ข้อมุลลงฐานด้วยค่ะ


ตัวอย่างนี้ครับ

Code (PHP)
	<?
		mysql_connect("localhost","root","root") or die (mysql_error());
		mysql_select_db("mydatabase");

		for($i=1;$i<=(int)($_POST["hdnLine"]);$i++)
		{
			if($_FILES["fileUpload".$i]["name"] != "")
			{
				if(move_uploaded_file($_FILES["fileUpload".$i]["tmp_name"],"thaicreate/".$_FILES["fileUpload".$i]["name"]))
				{
					$strSQL = "INSERT INTO gallery ";
					$strSQL .="(GalleryName,Picture) VALUES ('".$_POST["txtGalleryName".$i]."','".$_FILES["fileUpload".$i]["name"]."')";
					mysql_query($strSQL);
					echo "Copy/Upload ".$_FILES["fileUpload".$i]["name"]." completed.<br>";
				}
			}
		}

		echo "<br><a href='php_multiple_upload6.php'>View file</a>";

		mysql_close();
	?>


Go to : PHP MySQL Upload File to MySQL Database - Multiple Dynamic CreateElement Input File Upload
Date : 2011-12-15 15:57:25 By : webmaster
 


 

No. 9

Guest


ขอบคุณค่ะ Mr Win จะลองทำดู น่ะค่ะ
Date : 2011-12-15 16:52:32 By : soon
 


 

No. 10

Guest


ไม่ได้อ่ะค่ะ เออตัวไหนคือตัวแปรที่รับค่า แล้วตัวไหนคือตัวแปรที่เก็บลงฐานข้อมูลค่ะ
Date : 2011-12-15 17:42:35 By : หหห
 


 

No. 11



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



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


Date : 2012-01-14 16:03:12 By : eii-mian
 


 

No. 12



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

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

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

Quote:
ไม่ได้อ่ะค่ะ เออตัวไหนคือตัวแปรที่รับค่า แล้วตัวไหนคือตัวแปรที่เก็บลงฐานข้อมูลค่ะ



Code (PHP)
<?
	mysql_connect("localhost","root","root") or die (mysql_error());
	mysql_select_db("mydatabase");

	for($i=1;$i<=(int)($_POST["hdnLine"]);$i++)
	{
		if($_FILES["fileUpload".$i]["name"] != "")
		{
			if(move_uploaded_file($_FILES["fileUpload".$i]["tmp_name"],"thaicreate/".$_FILES["fileUpload".$i]["name"]))
			{
				$strSQL = "INSERT INTO gallery ";
				$strSQL .="(GalleryName,Picture) VALUES ('".$_POST["txtGalleryName".$i]."','".$_FILES["fileUpload".$i]["name"]."')";
				mysql_query($strSQL);
				echo "Copy/Upload ".$_FILES["fileUpload".$i]["name"]." completed.<br>";
			}
		}
	}

	echo "<br><a href='php_multiple_upload6.php'>View file</a>";

	mysql_close();
?>

Date : 2012-01-14 16:43:08 By : webmaster
 


 

No. 13

Guest


แล้วแบบ ให้ค่า textbox ที่เพิ่มมา ที่เรากรอกแล้ว ให้มันลงฐานข้อมูล อะคาบต้องแก้ตรงไหนหรอคาบ
Date : 2012-01-23 23:49:11 By : pangkung
 


 

No. 14

Guest


ขอบคุณมากนะครับ
Date : 2013-07-16 23:35:13 By : ผู้ผ่านทาง
 


 

No. 15



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



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


del

ถ้าต้องการเลือกแถวที่ต้องการลบ โดยไม่ต้องลบตามลำดับ เช่น ต้องการลบแถวที่สาม ต้องเขียนโค้ดยังไงครับ
Date : 2014-03-19 15:26:13 By : Realiku
 


 

No. 16



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

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

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


จากที่ผมเคยถามไว้ ที่ https://www.thaicreate.com/php/forum/106539.html ลองเอาไปศึกษาก่อนครับ
Date : 2014-03-19 18:11:21 By : apisitp
 


 

No. 17



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



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


ขอบุณครับ
Date : 2014-03-19 20:15:13 By : Realiku
 


 

No. 18



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



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


ลองศึกษาดูแล้วครับ

ยังลบไม่ตรงตามแถวที่เราเลือกครับ
Date : 2014-03-20 12:26:47 By : doflamingoko
 


 

No. 19



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

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

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


ตอนนี้แก้ไขโค้ดถึงไหนแล้ว เอามาวางให้ดูหน่อยครับ
Date : 2014-03-20 12:31:27 By : sakuraei
 


 

No. 20



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

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

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


จากกระทู้นั้น มันยังมีอะไรเพิ่มมาอีกนิดหน่อย แต่ผมขี้เกียจตัด Code มาโพสต์ เหอะ ๆ ... ถ้าไม่ได้จริงค่อยว่ากัน
Date : 2014-03-20 13:48:40 By : apisitp
 


 

No. 21



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

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

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


ครับ.. ตอนนี้ผมไม่รู้แล้ว ว่าใครเป็นคนถาม หรือใครติดตรงไหนอยู่ล่ะครับ
ถ้ามีเวลาก็จะแวะมาดูเป็นพักๆครับ
Date : 2014-03-20 14:40:29 By : sakuraei
 


 

No. 22



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



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


ถ้าต้องการเพิ่มที่ละ 3แถว ขั้นไปละครับต้องแก้สวนไหน
Code (PHP)
<html>
<head>
<title>ThaiCreate.Com JavaScript Add/Remove Element</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<script language="javascript">
	function CreateNewRow()
	{
		var intLine = parseInt(document.frmMain.hdnMaxLine.value);
		intLine++;
			
		var theTable = document.all.tbExp
		var newRow = theTable.insertRow(theTable.rows.length)
		newRow.id = newRow.uniqueID
		
		var item1 = 1
		var newCell
		
		//*** Column 1 ***//
		newCell = newRow.insertCell(0)
		newCell.id = newCell.uniqueID
		newCell.setAttribute("className", "css-name");
		newCell.innerHTML = "<center><INPUT TYPE=\"TEXT\" SIZE=\"5\" NAME=\"Column1_"+intLine+"\" VALUE=\"\"></center>"

		//*** Column 2 ***//
		newCell = newRow.insertCell(1)
		newCell.id = newCell.uniqueID
		newCell.setAttribute("className", "css-name");
		newCell.innerHTML = "<center><INPUT TYPE=\"TEXT\" SIZE=\"5\" NAME=\"Column2_"+intLine+"\" VALUE=\"\"></center>"		
		
		//*** Column 3 ***//
		newCell = newRow.insertCell(2)
		newCell.id = newCell.uniqueID
		newCell.setAttribute("className", "css-name");
		newCell.innerHTML = "<center><INPUT TYPE=\"TEXT\" SIZE=\"5\" NAME=\"Column3_"+intLine+"\" VALUE=\"\"></center>"				
		
		//*** Column 4 ***//
		newCell = newRow.insertCell(3)
		newCell.id = newCell.uniqueID
		newCell.setAttribute("className", "css-name");
		newCell.innerHTML = "<center><INPUT TYPE=\"TEXT\" SIZE=\"5\" NAME=\"Column4_"+intLine+"\" VALUE=\"\"></center>"		
		
		//*** Column 5 ***//
		newCell = newRow.insertCell(4)
		newCell.id = newCell.uniqueID
		newCell.setAttribute("className", "css-name");
		newCell.innerHTML = "<center><INPUT TYPE=\"TEXT\" SIZE=\"5\" NAME=\"Column5_"+intLine+"\" VALUE=\"\"></center>"			
		
		document.frmMain.hdnMaxLine.value = intLine;
	}
	
	function RemoveRow()
	{
		intLine = parseInt(document.frmMain.hdnMaxLine.value);
		if(parseInt(intLine) > 0)
		{
				theTable = (document.all) ? document.all.tbExp : 
				document.getElementById("tbExp")
				theTableBody = theTable.tBodies[0];
				theTableBody.deleteRow(intLine);
				intLine--;
				document.frmMain.hdnMaxLine.value = intLine;
		}	
	}	
</script>
<body>
<form name="frmMain" method="post">
<table width="445" border="1" id="tbExp">
  <tr>
    <td><div align="center">Column 1 </div></td>
    <td><div align="center">Column 2 </div></td>
    <td><div align="center">Column 3 </div></td>
    <td><div align="center">Column 4 </div></td>
    <td><div align="center">Column 5 </div></td>
  </tr>
</table>
<input type="hidden" name="hdnMaxLine" value="0">
<input name="btnAdd" type="button" id="btnAdd" value="+" onClick="CreateNewRow();">
<input name="btnDel" type="button" id="btnDel" value="-" onClick="RemoveRow();">
</form>
</body>
</html>




ประวัติการแก้ไข
2016-08-25 12:03:25
Date : 2016-08-25 12:00:45 By : fzjameza
 

   

ค้นหาข้อมูล


   
 

แสดงความคิดเห็น
Re : Java Script การเพิ่ม TextBox มี Button สำหรับเพิ่มจำนวน TextBox คือหากต้องการเพิ่ม 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 01
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 อัตราราคา คลิกที่นี่