|
 |
| |
textbox เพิ่มได้แค่ 5 อันทำอย่างไรครับและต้องการแบบไม่ใช่array |
| |
 |
|
|
 |
 |
|
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
var i = 1;
$(function(){
$('#btn-add').click(function(){
if(i <= 5) {
$('#group-textbox').append('<p><input type="text" name="textbox' + i + '" id="textbox' + i + '" /></p>\n');
i++;
} else
alert('เพิ่มได้แค่ 5 อันเท่านั้น');
});
$('#btn-del').click(function(){
var r = "input#textbox" + (i-1);
if(i > 1) {
$(r).remove();
i--;
} else
alert('ไม่มี textbox ที่จะลบ');
});
});
</script>
</head>
<body>
<div id="group-textbox"></div>
<input type="button" id="btn-add" value="เพิ่ม Textbox" /><input type="button" id="btn-del" value="ลบ Textbox" />
</body>
</html>
|
 |
 |
 |
 |
| Date :
2010-07-26 19:34:04 |
By :
DownsTream |
|
 |
 |
 |
 |
|
|
 |
 |
|
 |
 |
| |
|
|
|
| |
|
ถ้าเราอยากจะแสดง textbox อันหนึ่งก่อนทำไงครับ
ขอบคุณครับ
|
| |
|
|
| |
| Date :
2010-07-26 19:59:22 |
By :
คนมันรัก |
|
|
| |
|
|
|
|
|
| |
|
|
|
| |
|
|
|
| |
|
ถ้าแก้จากโค้ดนี้ทำไงครับ
Code (PHP)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><!-- InstanceBegin template="/Templates/Form_new_table.dwt" codeOutsideHTMLIsLocked="false" -->
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-874" />
<script type="text/javascript">
var i = 1;
<!--
var gFiles = 0;
function addFile() {
var li = document.createElement('li');
li.setAttribute('id', 'file-' + gFiles);
li.innerHTML = 'เลขทะเบียบรถ : <input type="text" name="PLATE_NUMBER"><span onclick="removeFile(\'file-' + gFiles + '\')" style="cursor:pointer;"> ลบ</span>';
document.getElementById('files-root').appendChild(li);
gFiles++;
}
function removeFile(aId) {
var obj = document.getElementById(aId);
obj.parentNode.removeChild(obj);
}
--></script>
</head>
<body>
<form action="dlt_1.php" method="post">
มีความประสงค์ที่จะขอใช้รถดังต่อไปนี้
<br /><br />
<ol id="files-root">
<li>เลขทะเบียบรถ : <input type="text" name="PLATE_NUMBER1[]" /><span onclick="addFile()" style="cursor:pointer;"> <u>เพิ่ม</u></span>
</li></ol>
<br />
<br />
<input name="btnButton2" type="button" value="ส่ง" style="width:80px;height:40px" >
</html>
|
| |
|
|
| |
| Date :
2010-07-26 20:17:26 |
By :
คนมันรัก |
|
|
| |
|
|
|
|
|
| |
|
|
|
| |
|
|
|
| |
|
Go to : อยากได้ Textbox CreateElement แบบเพิ่มได้ที่ไม่เป็น Array
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
|
| |
|
|
| |
| Date :
2010-09-06 12:24:07 |
By :
webmaster |
|
|
| |
|
|
|
|
|
| |
|
|
|
|
|
| |
|
 Load balance : Server 00
|
