Onchange使用ajax在表行中追加数据
Onchange append data in table row using ajax
我想更改select标记中所选选项值的表。但我也想将结果附加到现有的表行中,为此我可以将数据检索到表中,但不能在tbody
的内部html中附加新行。我只想知道如何将行附加到ajax响应文本中,我已经尝试过了。
<script>
function resInvoice(InvoiceVal){
var xhttp;
if (InvoiceVal == "") {
document.getElementById("InvoiceBody").innerHTML = "";
return;
}
xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (xhttp.readyState == 4 && xhttp.status == 200) {
document.getElementById("InvoiceBody").innerHTML="<tr>"+xhttp.responseText+"</tr>");
}
};
xhttp.open("GET", "GetSelect.php?InData="+InvoiceVal, true);
xhttp.send();
}
</script>
<tbody id="InvoiceBody">
<tr id="select">
<td colspan="2">
<select class='form-control select2' onchange="resInvoice(this.value)">
<?php
$fqeyr="SELECT ItemID,LineItemName FROM `per_addnew_lineitem`";
$faddnew=mysqli_query($con,$fqeyr);
while($fnrow=mysqli_fetch_array($faddnew)){
$lname=$fnrow['LineItemName'];
?>
<option value="<?php echo $fnrow['ItemID'] ;?>">
<?php echo $lname ; ?>
</option>
<?php } ?>
</select>
</td>
<td>
<button type="button" class="btn btn-primary btn-xs" style="margin-top:12px;" data-toggle="modal" data-target="#AddNewLine">+ Add New Line Item </button>
</td>
</tr>
</tbody>
和IN GetSelect.php
if(isset($_GET['InData'])){
$InData=$_GET['InData'];
$InDataRes=mysqli_query($con,"SELECT * FROM `per_addnew_lineitem` where ItemID='$InData'");
while($InvoiceD=mysqli_fetch_array($InDataRes)){
echo '<td>'.$InvoiceD['LineItemName'].'</td>' ;
echo '<td>'.$InvoiceD['Description'].'</td>' ;
echo '<td>'.$InvoiceD['Calculation'].'</td>' ;
}
}
试试这个
var new_row = "<tr>" + xhttp.responseText + "</tr>";
$("#InvoiceBody").append(new_row);
代替
document.getElementById("InvoiceBody").innerHTML="<tr>"+xhttp.responseText+"</tr>");
相关文章:
- jQuery动态使用.append()添加输入,但发布表单不是追加数据
- 从脚本后加载的处理程序追加数据
- 如何在单击事件中追加数据来自数据表
- jQuery InfiniteScroll如何追加数据
- D3 表根据不同的数据类型追加数据
- jQuery.移动子追加数据
- 使用纯 Javascript 在类中追加数据
- 单击时从 AJAX .each() 循环追加数据
- 如何等到添加表单数据后再追加数据
- 如何在追加数据并完成该数据的函数后连续运行函数
- jQuery - 如何向下滑动正文追加数据
- Onchange使用ajax在表行中追加数据
- 自动求和和和追加数据javascript
- 追加数据属性时出现无法识别的表达式
- 可处理的无限滚动追加数据和应用合并单元格格式
- 使用jQuery隐藏和追加数据
- 为什么弹出窗口不能'工作时追加数据到主体表
- 在另一个文件中追加数据
- 向Google地图的业务位置追加数据
- 如何选择在哪里追加数据