表单无法填充数据库返回的JSON数据的问题排查求助
表单无法填充数据库返回的JSON数据的问题排查求助
我现在遇到一个很棘手的问题:本地项目里有一个用于编辑数据库字段的表单,通过浏览器DevTools的Network面板能看到AJAX请求已经成功返回了预期的JSON数据,但表单始终无法自动填充这些数据。我怀疑是表单ID和JSON键名不匹配,但反复检查后还是没找到问题,有没有大佬能帮我诊断一下哪里出问题了?
问题背景
- 操作流程:调用
agregaDatosInventario(id)方法发起AJAX请求,后端返回对应ID的库存数据JSON - 异常现象:Network面板显示请求成功且JSON数据正确,但表单输入框没有被赋值
- 怀疑方向:表单ID与JSON键名不匹配、AJAX回调逻辑问题、后端数据返回问题
前端代码
HTML 表单结构
<form id="frmInventariosU"> <input type="text" id="idinventarioU" hidden="" name="idinventarioU"> <label>Articulo</label> <input type="text" class="form-control" id="nombre_articuloU" name="nombre_articuloU"> <label>Tipo Modelo</label> <input type="text" class="form-control" id="tipo_modeloU" name="tipo_modeloU"> <label>Color</label> <input type="text" class="form-control" id="colorU" name="colorU"> <label>Marca</label> <input type="text" class="form-control" id="marcaU" name="marcaU"> <label>Medida</label> <input type="text" class="form-control" id="medidaU" name="medidaU"> <label>Existencia</label> <input type="text" class="form-control" id="existenciaU" name="existenciaU"> <label>Entrada</label> <input type="text" class="form-control" id="entradaU" name="entradaU"> <label>Salida</label> <input type="text" class="form-control" id="salidaU" name="salidaU"> </form>
AJAX 数据填充逻辑
function agregaDatosInventario(idinventario){ $.ajax({ type:"POST", data:"idinventario=" + idinventario, url:"../procesos/inventario/obtenDatosInventario.php", success:function(r){ dato=jQuery.parseJSON(r); $('#idinventarioU').val(dato['id_inventario']); $('#nombre_articuloU').val(dato['nombre_articulo']); $('#tipo_modeloU').val(dato['tipo_modelo']); $('#colorU').val(dato['color']); $('#marcaU').val(dato['marca']); $('#medidaU').val(dato['medida']); $('#existenciaU').val(dato['existencia']); $('#entradaU').val(dato['entrada']); $('#salidaU').val(dato['salida']); } }); }
后端代码
PHP 请求处理文件 (obtenDatosInventario.php)
<?php require_once "../../clases/Conexion.php"; require_once "../../clases/Inventario.php"; $obj = new inventario(); echo json_encode($obj->obtenDatosInventario($_POST['idinventario'])); ?>
数据库查询方法 (Inventario类)
public function obtenDatosInventario($idinventario){ $c= new conectar(); $conexion=$c->conexion(); $sql="SELECT id_inventario, nombre_articulo, tipo_modelo, color, marca, medida, existencia, entrada, salida from inventario"; $result=mysqli_query($conexion,$sql); $ver=mysqli_fetch_row($result); $datos=array( 'id_inventario' => $ver[0], 'nombre_articulo' => $ver[1], 'tipo_modelo' => $ver[2], 'color' => $ver[3], 'marca' => $ver[4], 'medida' => $ver[5], 'existencia' => $ver[6], 'entrada' => $ver[7], 'salida' => $ver[8] ); return $datos; }
我已经做的排查
- 确认Network面板中AJAX请求的状态码为200,返回的JSON数据结构和内容完全符合预期
- 核对了表单输入框的ID与JSON对象的键名,暂时没发现拼写错误
- 确认表单元素在AJAX请求发起前已经被正确渲染到DOM中
有没有大佬能帮我找到问题所在?非常感谢!
内容来源于stack exchange
相关产品推荐
相关产品推荐

