我正在使用ajax添加和删除，但是在更新时遇到问题。
我的路由文件啪.php
Route::get('room-list', 'RoomController@list');
Route::resource('room', 'RoomController', [
'except' => ['create']
]);
Route::get('api/room', 'RoomController@apiRoom')->name('api.room');
我的视图文件房间列表.刀片.php
DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<meta name="csrf-token" content="{{ csrf_token() }}">
<link rel="icon" type="image/png" sizes="16x16" href="{{url('assets/images')}}/favicon.png">
<title>Room Insert, Update, Delete</title>
<!-- Bootstrap Core CSS -->
<link href="{{url('assets/plugins/bootstrap/css/bootstrap.min.css')}}" rel="stylesheet">
<!-- Custom CSS -->
<link href="{{url('css/style.css')}}" rel="stylesheet">
<!-- You can change the theme colors from here -->
<link href="{{url('css/colors/blue.css')}}" id="theme" rel="stylesheet">
{{-- dataTables --}}
<link href="{{ asset('assets/bootstrap/css/ie10-viewport-bug-workaround.css') }}" rel="stylesheet">
</head>
<body class="fix-header card-no-border">
<div id="main-wrapper">
@include('theme.sidebar')
<div class="page-wrapper">
<div class="container-fluid">
<div class="col-12">
<div class="row page-titles">
<div class="col-md-10">
</div>
<div class="col-md-2">
<button onclick="addForm()" type="button" class="btn btn-info" data-toggle="modal" data-target="#modal-form"><i class="fa fa-plus"></i> Add New Room</button>
</div>
</div>
</div>
<div class="col-12">
<div class="card">
<div class="card-body">
<h4 class="card-title">Room List</h4>
<h6 class="card-subtitle"></h6>
<div class="table-responsive m-t-40">
@if (Session::has('success'))
<div class="alert alert-success">
<p>{!! Session::get('success') !!}</p>
</div>
@endif
@if (Session::has('deleted'))
<div class="alert alert-warm">
<p>{!! Session::get('deleted') !!}</p>
</div>
@endif
@if (Session::has('edit'))
<div class="alert alert-edit">
<p>{!! Session::get('edit') !!}</p>
</div>
@endif
<table id="room-table" class="table table-striped" cellspacing="0" width="100%">
<thead>
<tr>
<th>Room ID</th>
<th>Hotel ID</th>
<th>Room Name</th>
<th>Bonus Sum</th>
<th>Settings</th>
</tr>
</thead>
<tbody>
@foreach($rooms as $room)
<tr>
<td>{!! $room->room_id !!}</td>
<td>{!! $room->hotel_id !!}</td>
<td>{!! $room->room_name !!}</td>
<td>{!! $room->bonus_sum !!}</td>
<td></td>
</tr>
@endforeach
</tbody>
</table>
</div>
</div>
</div>
</div>
@include('room.room-form')
</div>
<footer class="footer">
© 2017
</footer>
</div>
</div>
<!-- Bootstrap tether Core JavaScript -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<script src="{{ asset ('assets/plugins/jquery/jquery.min.js') }}"></script>
<script src="{{ asset ('assets/plugins/bootstrap/js/popper.min.js') }}"></script>
<script src="{{ asset ('assets/bootstrap/js/bootstrap.min.js') }}"></script>
<script src="{{ asset ('assets/plugins/bootstrap/js/bootstrap.min.js') }}"></script>
<!-- slimscrollbar scrollbar JavaScript -->
<script src="{{ url ('js/jquery.slimscroll.js') }}"></script>
<!--Menu sidebar -->
<script src="{{ url ('js/sidebarmenu.js')}}"></script>
<!--stickey kit -->
<script src="{{ url ('assets/plugins/sticky-kit-master/dist/sticky-kit.min.js') }}"></script>
<script src="{{ url ('assets/plugins/sparkline/jquery.sparkline.min.js') }}"></script>
<!-- Custom JavaScript -->
<script src="{{ url ('js/custom.min.js') }}"></script>
{{-- dataTables --}}
<script src="{{ asset ('assets/dataTables/js/jquery.dataTables.min.js') }}"></script>
--}}
<script type="text/javascript">
$.ajaxSetup({
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
}
});
var table = $('#room-table').DataTable({
processing: true,
serverSide: true,
ajax: "{{ route('api.room') }}",
columns: [
{data: 'room_id', name: 'room_id'},
{data: 'hotel_id', name: 'hotel_id'},
{data: 'room_name', name: 'room_name'},
{data: 'bonus_sum', name: 'bonus_sum'},
{data: 'action', name: 'action', orderable: false, searchable: false}
]
});
function addForm() {
save_method = "add";
$('input[name=_method]').val('POST');
$('#modal-form').modal('show');
$('#modal-form form')[0].reset();
$('.modal-title').text('Add Room');
}
function editForm(id) {
save_method = 'edit';
$('input[name=_method]').val('PATCH');
$('#modal-form form')[0].reset();
$.ajax({
url: "{{ url('room') }}" + '/' + id + "/edit",
type: "GET",
dataType: "JSON",
success: function(data) {
$('#modal-form').modal('show');
$('.modal-title').text('Edit Contact');
$('#room_id').val(data.room_id);
$('#hotel_id').val(data.hotel_id);
$('#room_name').val(data.room_name);
$('#bonus_sum').val(data.bonus_sum);
},
error : function() {
alert("Nothing Data");
}
});
}
function deleteData(id){
var popup = confirm("Are you sure for delete this data ?");
var csrf_token = $('meta[name="csrf-token"]').attr('content');
if (popup == true ){
$.ajax({
url : "{{ url('room') }}" + '/' + id,
type : "POST",
data : {'_method' : 'DELETE', '_token' : csrf_token},
success : function(data) {
table.ajax.reload();
},
error : function () {
alert("Oops! Something Wrong!");
}
})
}
}
$(function(){
$('#modal-form form').validator().on('submit', function (e) {
if (!e.isDefaultPrevented()){
var id = $('#id').val();
if (save_method == 'add') url = "{{ url('room') }}";
else url = "{{ url('room') . '/' }}" + id;
$.ajax({
url : url,
type : "POST",
data : $('#modal-form form').serialize(),
success : function($data) {
$('#modal-form').modal('hide');
table.ajax.reload();
},
error : function(){
alert('Oops! Something Error!');
}
});
return false;
}
});
});
</script>
</body>
</html>
以下代码包含在具有表单文件的包含功能的room-list.blade.php文件中
<div class="modal" id="modal-form" tabindex="-1" role="dialog" aria-hidden="true" data-backdrop="static">
<div class="modal-dialog">
<div class="modal-content">
<form method="POST" class="form-horizontal" data-toggle="validator" action="{{ route ('room.store') }}">
{{ csrf_field() }} {{ method_field('POST') }}
<input type="hidden" name="room_id" id="room_id">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true"> × </span>
</button>
<h3 class="modal-title"></h3>
</div>
<div class="modal-body">
<div class="form-group">
<label class="control-label">Hotel</label>
<select id="hotel_id" name="hotel_id" class="select2 form-control custom-select" style="width: 100%; height:36px;">
<option selected>Hotel Name...</option>
</select>
</div>
<div class="form-group">
<label for="message-text" class="control-label">Room Name</label>
<input type="text" id="room_name" name="room_name" class="form-control">
</div>
<div class="form-group">
<label for="message-text" class="control-label">Bonus Sum</label>
<input type="text" id="bonus_sum" name="bonus_sum" class="form-control">
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
<button id="tamamla" type="submit" class="btn btn-primary btn-save">Submit</button>
</div>
</form>
</div>
</div>
</div>
我的控制器文件房间控制器.php
<?php
namespace AppHttpControllers;
use AppRoom;
use DataTables;
use DB;
use IlluminateHttpRedirect;
use IlluminateHttpRequest;
class RoomController extends Controller {
/**
* Display a listing of the resource.
*
* @return IlluminateHttpResponse
*/
public function index() {
}
public function list() {
$rooms = Room::all();
return view('room.room-list', compact('rooms'));
}
/**
* Show the form for creating a new resource.
*
* @return IlluminateHttpResponse
*/
public function create() {
}
/**
* Store a newly created resource in storage.
*
* @param IlluminateHttpRequest $request
* @return IlluminateHttpResponse
*/
public function store(Request $request) {
$data = [
'hotel_id' => $request['hotel_id'],
'room_name' => $request['room_name'],
'bonus_sum' => $request['bonus_sum']
];
Room::create($data);
return redirect()->back()->with('success', 'Kayıt başarılı bir şekilde eklendi!');
}
/**
* Display the specified resource.
*
* @param int $id
* @return IlluminateHttpResponse
*/
public function show($id) {
//
}
/**
* Show the form for editing the specified resource.
*
* @param int $id
* @return IlluminateHttpResponse
*/
public function edit($id) {
$data = Room::find($id);
return $data;
}
/**
* Update the specified resource in storage.
*
* @param IlluminateHttpRequest $request
* @param int $id
* @return IlluminateHttpResponse
*/
public function update(Request $request, $id) {
$room = new AppRoom;
$data = $room->findOrFail($id);
$data->hotel_id = $request['hotel_id'];
$data->room_name = $request['room_name'];
$data->bonus_sum = $request['bonus_sum'];
$data->update();
return redirect()->back()->with('edit', 'Kayıt başarılı şekilde düzenlendi!');
}
/**
* Remove the specified resource from storage.
*
* @param int $id
* @return IlluminateHttpResponse
*/
public function destroy($id) {
$rooms = Room::find($id);
$rooms->delete();
return redirect()->back()->with('deleted', 'Kayıt başarılı şekilde silindi!');
}
public function apiRoom() {
$rooms = Room::all();
return Datatables::of($rooms)
->addColumn('action', function ($rooms) {
return '<a onclick="editForm('.$rooms->room_id.')" data-toggle="tooltip" data-original-title="Edit"> <i class="fa fa-pencil text-inverse m-r-10"></i> </a>'.
'<a onclick="deleteData('.$rooms->room_id.')" data-toggle="tooltip" data-original-title="Close"> <i class="fa fa-close text-danger"></i> </a>';
})->make(true);
}
}
我认为这个问题与 ajax 有关。
action="{{ route ('room.store') }}"
如果我删除表单内的动作标签，它不起作用。如果保持这种方式，则更新不起作用。
如何在一个表单中无缝运行更新和附加组件。
此致敬意
我认为问题是您始终在控制器中重新创建列表，但不会替换页面 dom 中的旧列表。
从控制器：
public function list() {
$rooms = Room::all();
return view('room.room-list', compact('rooms'));
}
获取整个列表并将其作为 Ajax 调用的响应。
我认为您必须从javascript方面获得响应并在页面中替换它。如果您将整个"房间列表"块放在一个div 中并使用 ajax 响应将此div 的内容替换为 javascript，则可以获得它。
@Alviero感谢您的回答
新的路由代码网络.php
Route::get('room-list', function () {
return view('room.room-list');
});
Route::resource('room', 'RoomController', [
'except' => ['create']
]);
Route::get('api/room', 'RoomController@apiRoom')->name('api.room');
然后是新的视图文件room-list.blade.php
<table id="room-table" class="table table-striped">
<thead>
<tr>
<th width="30">Room ID</th>
<th>Hotel ID</th>
<th>Room Name</th>
<th>Bonus Sum</th>
<th></th>
</tr>
</thead>
<tbody></tbody>
</table>
没有问题路由（api.room）工作正常。
但我给出同样的错误
Symfony Component HttpKernel Exception MethodNotAllowedHttpException
No message
文件路径供应商/symfony/路由/路由集合.php第 255 行
如果我添加表单操作标记操作="{{ route （'room.store'） }}"
它有效。但是这次更新不起作用，并且给出了相同的错误。
再次感谢。
我解决了这个问题。js 文件不需要表单操作。
您可以从此链接访问此JavaScript文件Validator.JS for Bootsrap 3
表单代码
<form method="POST" class="form-horizontal" data-toggle="validator">
{{ csrf_field() }} {{ method_field('POST') }}
无操作=" 表单标记
因此，您可以使用一个表单进行添加和更新
此致敬意