【发布时间】:2021-03-10 10:28:10
【问题描述】:
我在 laravel 中使用 ajax 作为 crud。更新或添加数据时,向列表添加新行但返回字符串“未定义”,刷新此页面时显示真实文本。
如何解决此问题?
控制器:
public function update(Request $request, $user_id)
{
$user = User::where('id', $user_id)->update([
'name' => $request->input('name'),
'email' => $request->input('email'),
'password' => Hash::make($request->input('password')),
]);
if ($request->input('role') == 'admin'){
$user = DB::table('model_has_roles')->where('model_id', $user_id)->update([
'role_id' => 2,
'model_type' => 'App\User',
'model_id' => $user_id,
]);
} else {
$user = DB::table('model_has_roles')->where('model_id', $user_id)->update([
'role_id' => 1,
'model_type' => 'App\User',
'model_id' => $user_id,
]);
}
return response()->json($user);
}
查看:
@foreach ($users as $user)
<tr id="user{{$user->id}}" class="active">
<td>{{$user->name}}</td>
<td>{{$user->email}}</td>
<td>{{ $user->hasRole('admin') ? 'Admin' : 'Author' }}</td>
<td width="35%">
<button class="btn btn-warning btn-detail open_modal" value="{{$user->id}}"> Edit </button>
<button class="btn btn-danger btn-delete delete-user" value="{{$user->id}}"> Delete </button>
</td>
</tr>
@endforeach
ajax 的 js 代码
$(document).ready(function(){
//get base URL *********************
var url = $('#url').val();
//display modal form for creating new user *********************
$('#btn_add').click(function(){
$('#btn-save').val("add");
$('#frmusers').trigger("reset");
$('#myModal').modal('show');
});
//display modal form for user EDIT ***************************
$(document).on('click','.open_modal',function(){
var user_id = $(this).val();
// Populate Data in Edit Modal Form
$.ajax({
type: "GET",
url: url + '/' + user_id,
success: function (data) {
console.log(data);
$('#user_id').val(data.id);
$('#name').val(data.name);
$('#password').val(data.password);
$('#email').val(data.email);
$('#btn-save').val("update");
$('#myModal').modal('show');
},
error: function (data) {
console.log('Error:', data);
}
});
});
//create new user / update existing user ***************************
$("#btn-save").click(function (e) {
$.ajaxSetup({
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
}
})
e.preventDefault();
var formData = {
name: $('#name').val(),
email: $('#email').val(),
password: $('#password').val(),
role: $('#role').val(),
}
//used to determine the http verb to use [add=POST], [update=PUT]
var state = $('#btn-save').val();
var type = "POST"; //for creating new resource
var user_id = $('#user_id').val();;
var my_url = url;
if (state == "update"){
type = "PUT"; //for updating existing resource
my_url += '/' + user_id;
}
console.log(formData);
$.ajax({
type: type,
url: my_url,
data: formData,
dataType: 'json',
success: function (data) {
console.log(data);
var user = '<tr id="user' + data.id + '"><td>' + data.name + '</td><td>' + data.email + '</td><td>' + data.role + '</td>';
user += '<td><button class="btn btn-warning btn-detail open_modal" value="' + data.id + '">ویرایش</button>';
user += ' <button class="btn btn-danger btn-delete delete-user" value="' + data.id + '">حذف</button></td></tr>';
if (state == "add"){ //if user added a new record
$("#users-list").append(user);
}else{ //if user updated an existing record
$("#user" + user_id).replaceWith( user );
}
$('#frmusers').trigger("reset");
$('#myModal').modal('hide')
},
error: function (data) {
console.log('Error:', data);
}
});
});
//delete user and remove it from TABLE list ***************************
$(document).on('click','.delete-user',function(){
var user_id = $(this).val();
$.ajaxSetup({
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
}
})
$.ajax({
type: "DELETE",
url: url + '/' + user_id,
success: function (data) {
console.log(data);
$("#user" + user_id).remove();
},
error: function (data) {
console.log('Error:', data);
}
});
});
});
.................................................. ..................................................... ..................................................... ................................................
【问题讨论】:
-
更新方法返回布尔值,所以基本上在所有 3 个块中,您将
$user设置为布尔值而不是对象 -
解决办法是什么?
-
在下面查看我的答案
标签: javascript php ajax laravel crud