我有这组带有自动完成功能的文本框和下拉列表。现在我想给一个添加按钮，当我点击添加按钮，我shouuld得到所有这些应该重复我的意思是2下拉菜单和2个文本框。我只能使用文本框来完成它，但为此我无法做到。
这是我的代码
<script src="jquery-1.10.2.js"></script>
<script src="jquery-ui.js"></script>
<script>
$(function() {
$( "#color" ).autocomplete({
source: 'search.php'
});
});
</script>
<script>
$(function() {
$( "#size" ).autocomplete({
source: 'search1.php'
});
});
</script>
</head>
<body>
<div class="col-md-12">
<div class="row">
<div class="ui-widget">
<label for="color">Item Color: </label>
<input id="color" name="color" type="text">
</div>
<div class="ui-widget">
<label for="size">Item Size: </label>
<input id="size"name="size" type="text">
</div>
<div><input type="text" name="cost_price" /></div>
<div><input type="text" name="selling_price" /></div>
</div>
</div>
的search.php
<?php
//database configuration
$dbHost = 'localhost';
$dbUsername = 'xxxx';
$dbPassword = 'xxxx';
$dbName = 'xxxx';
$db = new mysqli($dbHost,$dbUsername,$dbPassword,$dbName);
$searchTerm = $_GET['term'];
$query = $db->query("SELECT * FROM leads WHERE company LIKE '".$searchTerm."%' ORDER BY company ASC");
while ($row = $query->fetch_assoc()) {
$data[] = $row['company'];
}
echo json_encode($data);
?>
应该是这样的 http://jsfiddle.net/niklasvh/BT2BE/
*****更新****** 我能够像这样做
echo '<form method="post" action="' . htmlspecialchars($_SERVER['PHP_SELF'],ENT_QUOTES,'UTF-8') . '" >';
echo '<div>';
echo '<input type="hidden" name="FormID" value="' . $_SESSION['FormID'] . '" />';
echo '<br />'; ?>
<p>
<input type="button" value="Add Attributes" onClick="addRow('dataTable')" />
<input type="button" value="Remove Attributes" onClick="deleteRow('dataTable')" />
<p>(All acions apply only to entries with check marked check boxes only.)</p>
</p>
<table id="dataTable" class="selection">
<tbody>
<tr>
<p>
<td><input type="checkbox" required="required" name="chk[]" checked="checked" /></td>
<td>
<label for="Color">Select Color</label>
<select id="Color" name="Color[]" required="required">
<?php $sql = "SELECT * FROM itemcolor";
$result = DB_query($sql,$db);
while($myrow = DB_fetch_array($result))
{ ?>
<option value="<?php echo $myrow['color_id']; ?>"><?php echo $myrow['color']; ?></option>
<?php } ?>
</select>
</td>
<td>
<label for="Size">Select Size</label>
<select id="Size" name="Size[]" required="required">
<?php $sql = "SELECT * FROM itemsizes";
$result = DB_query($sql,$db);
while($myrow = DB_fetch_array($result))
{ ?>
<option value="<?php echo $myrow['size_id']; ?>"><?php echo $myrow['size']; ?></option>
<?php } ?>
</select>
</td>
<td>
<label>Cost Price</label>
<input type="text" required="required" name="Cost[]">
</td>
<td>
<label for="Sale">Selling Price</label>
<input type="text" required="required" name="Selling_price[]">
</td>
<input type="hidden" name="stockid" value="<?php echo $stockID; ?>" />
<td>
<label for="Stock">Opening Stock</label>
<input type="text" required="required" name="Opening_stock[]">
</td>
</p>
</tr>
</tbody>
</table>
<div class="clear"></div>
<?php
echo '<br /><div class="centre"><input type="submit" name="submit" value="' . _('Accept') . '" /><input type="submit" name="Cancel" value="' . _('Cancel') . '" /></div>';
echo '</div>
</form>';
if(isset($_POST['submit']))
{
$stk = $_POST['stockid'];
foreach ($_POST['chk'] as $k) {
$color = $_POST['Color'][$k];
$size = $_POST['Size'][$k];
$cost = $_POST['Cost'][$k];
$selling_price = $_POST['Selling_price'][$k];
$opening_stock = $_POST['Opening_stock'][$k];
$sql1 = "INSERT INTO itemarticles (stk_code, color, size, cost, selling_price, opening_stock) VALUES ('".$stk."', ".$color.", ".$size.", ".$cost.", ".$selling_price.", ".$opening_stock.")";
$result = DB_query($sql1,$db);
if($result)
{
header("location:StockAttributes.php?Success=1");
}
}
}
function addRow(tableID) {
var table = document.getElementById(tableID);
var rowCount = table.rows.length;
if(rowCount < 30){ // limit the user from creating fields more than your limits
var row = table.insertRow(rowCount);
var colCount = table.rows[0].cells.length;
for(var i=0; i<colCount; i++) {
var newcell = row.insertCell(i);
newcell.innerHTML = table.rows[0].cells[i].innerHTML;
}
}else{
alert("Maximum Attributes per Item is 30.");
}
}
function deleteRow(tableID) {
var table = document.getElementById(tableID);
var rowCount = table.rows.length;
for(var i=0; i<rowCount; i++) {
var row = table.rows[i];
var chkbox = row.cells[0].childNodes[0];
if(null != chkbox && true == chkbox.checked) {
if(rowCount <= 1) { // limit the user from removing all the fields
alert("Cannot Remove all the Attributes.");
break;
}
table.deleteRow(i);
rowCount--;
i--;
}
}
}
但我无法为每个条目添加计数器......类似于<input type="text" required="required" name="Opening_stock[$counter]">
我无法在哪里添加计数器。