这是我的表结构。
这是我的输出。
这是我的代码：
<table width="100%" id="controltable" border="1">
<tr>
<th>
Product Name
</th>
<th>
Product Price
</th>
<th >
Quantity
</th>
<th >
Calculate Price
</th>
<th >
Amount
</th>
</tr>
<tr>
<td>
<?php
echo '<select style="padding: 5px;" id="selectprice" name="prodlist">';
echo '<option value="">Select Product</option>';
$sql = mysql_query("SELECT * FROM prod_list");
while($row = mysql_fetch_array($sql)){
$get_prod = $row['prod_name'];
echo '<option value='.$get_prod.'>'.$get_prod.'</option>';
}
echo '</select>';
echo '<input type="hidden" name="price" id="hiddenconstvalue" value=""/>';
?>
<?php
echo '<input type="hidden" name="hiddenresult" id="hiddenresult" value=""/>';
?>
</td>
<td>
<div id="output_frame"></div>
</td>
<td>
<?php echo '<input type="text" style="width: 50px;" name="qnty" id="qnty" value=""/>';?>
</td>
<td>
<?php echo '<a href="javascript:void(0)" style="text-decoration: none;" onClick="show_price()">Calculate</a>'; ?>
</td>
<td>
<div id="result"></div>
</td>
</tr>
</table>
**Javascript Code**
<script type="text/javascript">
$(document).ready(function(){
$('#selectprice').on('change', function() {
$.get("get_price.php?prodId="+$(this).val(), function( data ) {
$('input[name=price]').val(data);
document.getElementById('output_frame').innerHTML = data;
});
});
});
function show_price()
{
var textValue1 = document.getElementById('hiddenconstvalue').value;
var textValue2 = document.getElementById('qnty').value;
document.getElementById('result').value = textValue1 * textValue2;
document.getElementById('result').innerHTML = textValue1 * textValue2;
}
这里一切正常。当用户选择如图所示的产品 strepsils 时，它会自动获取产品的价格。我通过使用 ajax 实现了这一点。选择产品后，将列出价格，并允许用户输入数量。因此，当单击计算价格时，将计算价格。现在我需要的是，如果用户想添加更多的文件说第二个产品为 vinly，它应该自动附加到上表中，并且应该计算总体价格。怎么做？请帮忙。