php - 如何使用 JQuery Repeater 和 php 显示数据库中的数据
问题描述
我一直在努力让 JQuery 中继器插件能够从数据库中获取数据。我已经完成了将数据插入数据库的工作,但我还没有检索插入的数据来编辑它。
这是我在 php 和 html 中的代码。
<div id="repeater">
<div class="repeater-heading" align="left">
<a role="button" class="btn btn-info repeater-add-btn" ><span class="glyphicon glyphicon-plus"> </span>Add Transactional Impact</a>
</div>
<div class="clearfix"></div>
<br>
<div class="items" data-group="impacts">
<div class="item-content">
<div class="form-group">
<?php
$query_raw_num = "SELECT * FROM revenue_impact_number WHERE revenue_impact_id='".$id."' ";
$results = $mysqli->query($query_raw_num);
while($impacts = $results->fetch_assoc()){
?>
<div class="row" data-repeater-item>
<div class="col-md-2">
<label>Region:</label>
<select data-skip-name="true" data-name="region_id[]" id="region_id" class="form-control">
<option value="">-- Select --</option>
<?php
$query_raw = "SELECT regions_id, regions_name FROM regions ";
$result = $mysqli->query($query_raw);
while($row = $result->fetch_assoc()){
?>
<option value="<?php echo $row['regions_id']; ?>" <?php echo ($row['regions_id']==$impacts['region_id'] ? 'selected' : ''); ?> ><?php echo $row['regions_name']; ?></option>
<?php } ?>
</select>
</div>
<div class="col-md-2">
<label>Product:</label>
<select data-skip-name="true" data-name="product_id[]" id="product_id" class="form-control">
<option value="">-- Select --</option>
<?php
$query_raw_products = "SELECT product_id, product_name FROM products ";
$result_products = $mysqli->query($query_raw_products);
while($products = $result_products->fetch_assoc()){
?>
<option value="<?php echo $products['product_id']; ?>" <?php echo ($products['product_id']==$impacts['product_id'] ? 'selected' : ''); ?> ><?php echo $products['product_name']; ?></option>
<?php } ?>
</select>
</div>
<div class="col-md-2">
<label>Impact:</label>
<input type="text" data-skip-name="true" data-name="impact_number[]" id="impact" value="<?php echo $impacts['impact_number'];?>" class="form-control" style="width:200px;"/>
</div>
<div class="col-md-2">
<label>Expected:</label>
<input type="text" data-skip-name="true" data-name="expected[]" id="expected" value="<?php echo $impacts['expected'];?>" class="form-control" style="width:200px;"/>
</div>
<div class="col-md-2" style="margin-top:24px;" align="center">
<a id="remove-btn" role="button" onclick="$(this).parents('.item-content').remove()" class="btn btn-danger" ><span class="glyphicon glyphicon-trash"> </span>Remove</a>
</div>
</div>
<?php } ?>
</div>
</div>
</div>
</di>
这是我正在使用的脚本功能。
$(function(){
$('#repeater').createRepeater();
});
当页面第一次加载时,一切都显示成功。见下图
我遇到的问题是,当我尝试添加新的字段组时,它会再次显示整个组,当我单击删除按钮时,它也会删除整个数据组。见下图。
解决方案
在编辑时检索现有数据时,中继器代码存在问题。在“repeater.js”文件中的以下行注释
/*
if (key == 0) {
items.remove();
addItem(newItem, key);
}
*/
推荐阅读
- wordpress - 使用 WooCommerce Rest API 创建带有优惠券行的订单
- azure - terraform:仅将公共 IP 添加到一个 azure VM
- python - 如何使用多个 3D 数组训练回归模型?
- javascript - 根据 JavaScript 中的值设置 CSS 样式
- leaflet - 带有翻转坐标的传单 .png 图像地图?
- android - Drawable 在 Android Studio 的不同活动布局中表现不同
- python - 从 Mixcloud 播放列表 Python Selenium 中提取 URL
- python - 我怎样才能让我的代码重复一个动作?我使用了“for i in range(x):”,但它似乎不起作用
- poker - 有多少种不同的方法可以将一组扑克分成 6 组?解决这个问题的最简单方法是什么?
- mysql - 使用存储在两个不同表中的数据和一个表中的性别和另一个表中的购买来查找前 5 名男性和前 5 名女性购买的 sql 表