php - 如何使用 ajax 和 php 制作编辑模式
问题描述
我在实现编辑功能时遇到问题,我可以编辑用户的角色
这是将打开模式的按钮
<button type="button" id="edit" name="edit" class="btn btn-outline-warning" data-id="'.$row["id"].'">EDIT</button>
这是模态代码
<div class="modal fade" id="editModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Edit User</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<form method="post" action="">
<div class="form-group">
<label for="userName" class="col-form-label">Username:</label>
<input type="text" class="form-control border-danger" id="userName" readonly style="background-color: #2A3038">
</div>
<div class="form-group">
<label for="user_type" class="col-form-label">User Type:</label>
<select class="form-control border-success" id="user_type">
<option value="user">User</option>
<option value="contributor">Contributor</option>
</select>
</div>
</form>
</div>
<div class="modal-footer">
<input type="hidden" id="user_id" name="user_id">
<button type="submit" id="update" name="update" class="btn btn-success">Update</button>
<button type="button" class="btn btn-light" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
阿贾克斯
$(document).on('click', '#edit', function(){
var user_id = $(this).attr("data-id");
$.ajax({
url:"/auth/action",
method:"POST",
data:{user_id:user_id},
dataType:"json",
success:function(data)
{
$('#editModal').modal('show');
$('#userName').val(data.userName);
$('#user_type').val(data.user_type);
$('#user_id').val(user_id);
}
})
});
动作发生的 PHP
if($_POST["action"] == 'update')
{
$query = 'UPDATE `users` SET username = :username, user_type = :user_type WHERE id = :id';
$statement = $connect->prepare($query);
$statement->execute(
array(
':id' => $_POST['user_id'],
':username' => $_POST['userName'],
':user_type' => $_POST['user_type']
)
);
$result = $statement->fetchAll();
if(isset($result))
{
echo '<div class="alert alert-fill-warning" role="alert">User type changed!<div>';
}
}
而且我还有一个我命名的 fetch 函数load_user_data()
这是数据类型 json
if(isset($_POST["user_id"]))
{
$output = array();
$statement = $connect->prepare(
"SELECT * FROM users WHERE id = '".$_POST["user_id"]."' LIMIT 1"
);
$statement->execute();
$result = $statement->fetchAll();
foreach($result as $row)
{
$output["userName"] = $row["username"];
$output["user_type"] = $row["user_type"];
}
echo json_encode($output);
}
我遇到的问题是 PHP 操作代码不起作用或者我的代码有什么问题?但我没有在模式中显示数据的问题,除非我提交更改,否则不会发生任何功能
解决方案
您的 ajax 数据属性缺少很多参数:
....ajax....
data: {user_id: user_id, userName: username here,user_type:set type here, action: 'update'}
您需要将编辑 ID 添加到更新按钮
您还需要将 userdata 添加到您的 ajax 响应中,目前您正在使用 data.userName 等,但您没有将其放入响应中
您可以在此处找到有关如何正确返回 json 响应的更多信息: 从 PHP 脚本返回 JSON
推荐阅读
- android - Exoplyaer 不会将当前位置从服务返回到活动?
- database - 如何在 mongoDB 服务器上配置 SSL?
- hadoop - 将hdfs文件附加到本地文件?
- youtube-api - Youtube API - 视频类别 ID 可分配
- vue.js - vue.js 反应性不适用于对象数组
- c# - 如何通过 C# 代码将 file:/// 转换为正常路径,例如:S:/soft/abc/xy.txt
- oop - Lua 程序中的文件无法引用彼此的变量
- c++ - wait_pop_head 函数会返回未指定的数据吗?
- mysql - MySQL group by comma separated list unique
- android - 我可以在运行时在 onClickListener 和 onLongClickListener 之间切换吗?