我正在使用 Yajra 資料表開發一個 Laravel 管理應用程式。
所以我有各種表，特別是在用戶表中，我需要通過 ajax 請求更改用戶的狀態（活動/非活動），只需單擊一個按鈕或勾選一個復選框。這是我第一次使用 ajax 和資料表，我不知道如何實作這一點......有可能還是有更好/更快的方法來做到這一點？
我接受任何意見或建議
我的代碼：
- 控制器
<?php
namespace Modules\User\Http\Controllers;
use Illuminate\Contracts\Support\Renderable;
use Illuminate\Http\Request;
use Illuminate\Routing\Controller;
use App\Models\User;
use DataTables;
use Illuminate\Support\Facades\Hash;
use Illuminate\Support\Facades\Auth;
class UserController extends Controller
{
/**
* Display a listing of the resource.
* @return Renderable
*/
public function index(Request $request)
{
$user = User::select('id', 'name', 'email', 'attivo' , 'email_verified_at', 'created_at')->get();
if($request->ajax()){
return Datatables::of($user)
->addIndexColumn()
->addColumn('stato', function($row){
($row['attivo'] == 1 ) ? $btn1 = '<div role="group" aria-label="Basic example"><a href="#" id="btn-post" dusk="postButton" role="button" data-toggle="modal" data-target="#addPost" style="color:white; font-size:small;">
<span > Disattiva</span>
</a>'
: $btn1 = '<div role="group" aria-label="Basic example"><button id="btnAttiva" style="color:white; font-size:small;">Attiva</button>';
return $btn1;
})
->addColumn('action', function($row){
$btn = '<div role="group" aria-label="Basic example"><a href="/user/detail/'.$row['id'].'" style="color:white; font-size:small;">View</a></div>';
$btn = $btn.'<a href="/user/edit/'.$row['id'].'" style="color:white; font-size:small;">Edit</a>';
$btn = $btn.'<form action="/user/delete" method="POST"><input type="hidden" name="_token" value="{{ @csrf() }}"><input type="hidden" name="_method" value="{{ @method(\'delete\') }}">
<input type="hidden" name="idu" value="'.$row['id'].'"><input type="submit" style="color:white; font-size:small;" value="Delete" /></form></div>';
return $btn;
})
->rawColumns(['action', 'stato'])
->make(true);
}
return view('user::index');
}
public function setState(Request $request){
// here i need to modify the user state
}
}
- 看法：
@extends('layouts.master')
@section('title', 'Lista Utenti')
@section('content')
@if (\Session::has('error'))
<div class="alert alert-danger">
<ul>
<li>{!! \Session::get('error') !!}</li>
</ul>
</div>
@endif
@if (\Session::has('success'))
<div class="alert alert-success">
<ul>
<li>{!! \Session::get('success') !!}</li>
</ul>
</div>
@endif
<div class="col-lg-12 grid-margin stretch-card">
<div class="card">
<div class="card-body">
<h4 class="card-title">Utenti</h4>
<p class="card-description">
Lista degli utenti registrati
</p>
<div class="table-responsive">
<table class="table table-bordered" id="dtUserList">
<thead>
<th>Id</th>
<th>Name</th>
<th>Email</th>
<th>Email Verificata</th>
<th>Stato</th>
<th>Created</th>
<th>Action</th>
</thead>
</table>
</div>
</div>
</div>
</div>
<div>
<a href="{{ url('/user/create') }}" hljs-string">"
style="color:white; font-size:small;">Aggiungi utente</a>
</div>
@endsection
@section('script')
<script>
$(function() {
var table = $('#dtUserList').DataTable({
processing: true,
serverSide: true,
ajax: '{{ url('user') }}',
columns: [
{ data: 'id', name: 'id', visible: false },
{ data: 'name', name: 'name' },
{ data: 'email', name: 'email' },
{ data: 'email_verified_at', name: 'email_verified_at'},
{ data: 'stato', name: 'stato', orderable: false, searchable: false},
{ data: 'created_at', name: 'created_at' },
{ data: 'action', name: 'action', orderable: false, searchable: false },
],
order: [[0, 'asc']]
});
});
</script>
@endsection
使用 AJAX 呼叫編輯的代碼：
- 查看 index.blade.php
@extends('layouts.master')
@section('title', 'Lista Utenti')
@section('content')
@if (\Session::has('error'))
<div class="alert alert-danger">
<ul>
<li>{!! \Session::get('error') !!}</li>
</ul>
</div>
@endif
@if (\Session::has('success'))
<div class="alert alert-success">
<ul>
<li>{!! \Session::get('success') !!}</li>
</ul>
</div>
@endif
<div class="col-lg-12 grid-margin stretch-card">
<div class="card">
<div class="card-body">
<h4 class="card-title">Utenti</h4>
<p class="card-description">
Lista degli utenti registrati
</p>
<div class="table-responsive">
<table class="table table-bordered" id="dtUserList">
<thead>
<th>Id</th>
<th>Name</th>
<th>Email</th>
<th>Email Verificata</th>
<th>Stato</th>
<th>Created</th>
<th>Action</th>
</thead>
</table>
</div>
</div>
</div>
</div>
<div>
<a href="{{ url('/user/create') }}" hljs-string">"
style="color:white; font-size:small;">Aggiungi utente</a>
</div>
@endsection
@section('script')
<script type="text/javascript">
$(function() {
var table = $('#dtUserList').DataTable({
processing: true,
serverSide: true,
ajax: '{{ url('user') }}',
columns: [
{ data: 'id', name: 'id', visible: false },
{ data: 'name', name: 'name' },
{ data: 'email', name: 'email' },
{ data: 'email_verified_at', name: 'email_verified_at'},
{ data: 'stato', name: 'stato', orderable: false, searchable: false},
{ data: 'created_at', name: 'created_at' },
{ data: 'action', name: 'action', orderable: false, searchable: false },
],
order: [[0, 'asc']]
});
});
$.fn.myFunction = function(form){
//put the form elements in an array
id = $(form).serializeArray();
//Get the value of the first index(the id)
iduser = id[0]['value'];
idstato = id[1]['value'];
$.ajax({
// Post method
type: 'POST',
// Url to the route
url: "{{ url('/user/deactivate') }}",
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
},
// Data to submit to the function
data: {
//CRSF token for laravel form validations
_token: $('meta[name="csrf-token"]').attr('content'),
idu: iduser,
ids: idstato
},
success: function(response){
//if request is made successfully then the response represent the data
$( "#result" ).empty().append( response );
}
});
}
</script>
@endsection
- 控制器：
<?php
namespace Modules\User\Http\Controllers;
use Illuminate\Contracts\Support\Renderable;
use Illuminate\Http\Request;
use Illuminate\Routing\Controller;
use App\Models\User;
use DataTables;
use Illuminate\Support\Facades\Hash;
use Illuminate\Support\Facades\Auth;
class UserController extends Controller
{
/**
* Display a listing of the resource.
* @return Renderable
*/
public function index(Request $request)
{
$user = User::select('id', 'name', 'email', 'attivo' , 'email_verified_at', 'created_at')->get();
if($request->ajax()){
return Datatables::of($user)
->addIndexColumn()
->addColumn('stato', function($row){
($row['attivo'] == 1 ) ? $btn1 = '<form><input type="hidden" name="user" value="'.$row['id'].'"><div ><select onchange="$.fn.myFunction(this.form)" name="stato"><option value="0">Disattivo</option><option value="1" selected>Attivo</option></select></div></form>'
: $btn1 = '<form><div ><input type="hidden" name="user" value="'.$row['id'].'"><select name="stato" onchange="$.fn.myFunction(this.form)"><option value="0" selected>Disattivo</option><option value="1">Attivo</option></select></div></form>';
return $btn1;
})
->addColumn('action', function($row){
$btn = '<div role="group" aria-label="Basic example"><a href="/user/detail/'.$row['id'].'" style="color:white; font-size:small;">View</a></div>';
$btn = $btn.'<a href="/user/edit/'.$row['id'].'" style="color:white; font-size:small;">Edit</a>';
$btn = $btn.'<form action="/user/delete" method="POST"><input type="hidden" name="_token" value="{{ @csrf() }}"><input type="hidden" name="_method" value="{{ @method(\'delete\') }}">
<input type="hidden" name="idu" value="'.$row['id'].'"><input type="submit" style="color:white; font-size:small;" value="Delete" /></form></div>';
return $btn;
})
->rawColumns(['action', 'stato'])
->make(true);
}
return view('user::index');
}
public function disattiva($idu, $ids){
dd($idu ":" $ids);
}
}
- 我的路線：
//rotte USER module with CRUD route
Route::middleware(['auth'])->prefix('user')->group(function() {
Route::get('/', 'UserController@index'); //dashboard -> lista utenti
Route::post('/deactivate', 'UserController@disattiva');
Route::get('/detail/{idu}', 'UserController@show'); // dettaglio specifico utente
Route::get('/edit/{idu}', 'UserController@showEditForm'); // form edit utente con dato idu
Route::patch('/edit', 'UserController@edit'); // scrivere le modifiche sul DB
Route::delete('/delete', 'UserController@destroy'); // eliminare utente dal DB
Route::get('/create', 'UserController@showCreateForm'); // form creazione nuovo utente
Route::post('/create', 'UserController@create'); // creare l'utente sul DB
Route::get('/profile', 'UserController@showProfile'); // mostra il profilo dell'utente loggato
});
uj5u.com熱心網友回復：
在表格中創建一個表單并在選擇中創建一個自定義函式（我假設您想使用選擇來更改它）
<select onchange="$.fn.myFunction(this.form)">
之后，您想創建一個像這樣的 ajax 請求：
$.fn.myFunction = function(form){
//put the form elements in an array
id = $(form).serializeArray();
//Get the value of the first index(the id)
id = id[0]["value"];
$.ajax({
// Post method
type: 'POST',
// Url to the route
url: "/ajax/myfunction",
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
},
// Data to submit to the function
data: {
//CRSF token for laravel form validations
_token: $('meta[name="csrf-token"]').attr('content'),
id: id
},
success: function(response){
//if request is made successfully then the response represent the data
$( "#result" ).empty().append( response );
}
});
}
轉載請註明出處，本文鏈接：https://www.uj5u.com/qita/444233.html
標籤：php 阿贾克斯 拉拉维尔 数据表 yajra 数据表