Έχετε παρατηρήσει ποτέ ότι ο πίνακας δεδομένων αποδίδει μόνο ορατές σειρές στο DOM; Αυτό σημαίνει ότι εάν υπάρχουν συμβάντα που ενεργοποιούνται μέσα στις σειρές του πίνακα δεδομένων, θα λειτουργήσει μόνο για τις ορατές σελίδες. Ο λόγος είναι ότι οτιδήποτε αποδίδεται στην πρώτη σελίδα θα προστεθεί στο δέντρο DOM. Εάν προσπαθήσετε να υποβάλετε όλες τις σειρές από τον πίνακα δεδομένων, τότε θα ωθήσει μόνο τις σειρές της πρώτης σελίδας. Αυτό συμβαίνει επειδή, στο δέντρο DOM, αποδίδονται μόνο οι ορατές σειρές. Έτσι, κατά την υποβολή της φόρμας, θα περάσει μόνο αυτές οι ορατές σειρές. Αλλά, πώς μπορείτε να περάσετε όλες τις σειρές που αποδίδονται δίπλα στην πρώτη σελίδα;
Σήμερα, μέσω αυτής της ανάρτησης, θα σας δείξω μία από τις λύσεις για χειρισμός φόρμας πίνακα δεδομένων. Λοιπόν, ας βουτήξουμε στη δημοσίευση για να εφαρμόσουμε αυτήν τη λειτουργικότητα.
Προαπαιτούμενα
Για την υλοποίηση αυτού του χειρισμού φόρμας πίνακα δεδομένων στο Laravel, πρέπει να ακολουθήσετε τις παρακάτω διαμορφώσεις. Εδώ, θα χρησιμοποιήσω το Laravel 9.
- PHP >=8.0.2
- Συνθέτης
- Διακομιστής Apache/Nginx
- VS Code Editor (Προαιρετικό)
- MySQL (έκδοση > 5)
Τώρα, ας μεταβούμε στο πρώτο βήμα της ρύθμισης του έργου.
Πώς να εφαρμόσετε το μοτίβο σχεδίασης αποθετηρίου στο Laravel 9
Δημιουργήστε ένα έργο Laravel για διαχείριση φόρμας πίνακα δεδομένων
Για τη δημιουργία ενός έργου, θα χρησιμοποιήσω τον συνθέτη. Μπορείτε να ανοίξετε το τερματικό και να δημιουργήσετε ένα έργο χρησιμοποιώντας την παρακάτω εντολή.
composer create-project --prefer-dist laravel/laravel datatable-formΜόλις ολοκληρωθεί η ρύθμιση του έργου, ας το ανοίξουμε στο πρόγραμμα επεξεργασίας. Μετά από αυτό, θα κάνουμε τη ρύθμιση παραμέτρων της βάσης δεδομένων.
Δημιουργία και διαμόρφωση βάσης δεδομένων
Για τη βάση δεδομένων, θα χρησιμοποιήσω MySQL. Λοιπόν, δημιούργησα τη βάση δεδομένων
CREATE DATABASE laravel_datatableΑφού δημιουργήσετε τη βάση δεδομένων, πρέπει να τη ρυθμίσετε στο έργο Laravel.
DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=laravel_datatable
DB_USERNAME={{ DB_USERNAME }}
DB_PASSWORD={{ DB_PASSWORD }}Μετά τη διαμόρφωση της βάσης δεδομένων, χρειαζόμαστε μοντέλο και μετεγκατάσταση για το χειρισμό δεδομένων.
Δημιουργήστε ένα μοντέλο και μετεγκατάσταση για χειρισμό φορμών πίνακα δεδομένων
Από προεπιλογή, έχουμε ήδη ένα μοντέλο και μια μετεγκατάσταση για τον χρήστη. Ως εκ τούτου, για λόγους απλότητας, θα χρησιμοποιήσω το ίδιο για αυτό το έργο. Μπορείτε να δημιουργήσετε διαφορετικά μοντέλα και μεταναστεύσεις εάν χρειάζεται.
Έχω ενημερώσει τη μετεγκατάσταση χρήστη όπως φαίνεται παρακάτω.
<?php
use Illuminate\Database\Migrations\Migration;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Support\Facades\Schema;
return new class extends Migration
{
/**
* Run the migrations.
*
* @return void
*/
public function up()
{
Schema::create('users', function (Blueprint $table) {
$table->id();
$table->string('name');
$table->string('email')->unique();
$table->string('address');
$table->timestamps();
});
}
/**
* Reverse the migrations.
*
* @return void
*/
public function down()
{
Schema::dropIfExists('users');
}
};
Μετά τη μετεγκατάσταση, πρέπει να ρυθμίσουμε τις παραμέτρους του Εργοστασιακή τάξη που ανήκουν στο μοντέλο χρήστη. Χρησιμοποιώντας αυτήν την εργοστασιακή κλάση, θα προσθέσω μερικές εικονικές εγγραφές για τον χρήστη.
Πώς να δημιουργήσετε ένα αρχείο Zip με οποιοδήποτε αρχείο και να το κατεβάσετε στο Laravel 9
Προσθήκη Factory Class για Προσθήκη Dummy Records
Και πάλι, έχουμε ήδη μια εργοστασιακή κατηγορία για το μοντέλο χρήστη. Ως εκ τούτου, θα χρησιμοποιήσω το ίδιο. Εάν χρειάζεστε, μπορείτε να προσθέσετε άλλο σύμφωνα με την απαίτηση.
<?php
namespace Database\Factories;
use Illuminate\Database\Eloquent\Factories\Factory;
use Illuminate\Support\Str;
/**
* @extends \Illuminate\Database\Eloquent\Factories\Factory<\App\Models\User>
*/
class UserFactory extends Factory
{
/**
* Define the model's default state.
*
* @return array<string, mixed>
*/
public function definition()
{
return [
'name' => fake()->name(),
'email' => fake()->unique()->safeEmail(),
'address' => fake()->address,
];
}
/**
* Indicate that the model's email address should be unverified.
*
* @return static
*/
public function unverified()
{
return $this->state(fn (array $attributes) => [
'email_verified_at' => null,
]);
}
}
Αφού ενημερώσουμε τα πεδία σύμφωνα με τη μετεγκατάσταση στην εργοστασιακή κλάση, θα μετεγκαταστήσουμε τον πίνακα.
php artisan migrateΗ παραπάνω εντολή θα μετεγκαταστήσει τους πίνακες σύμφωνα με το σχήμα μετεγκατάστασης.
Τώρα, στο επόμενο βήμα, πρέπει να δημιουργήσουμε εικονικές εγγραφές εργοστάσιο() τάξη.
php artisan tinker
User::factory()->count(25)->create()Η παραπάνω εντολή θα εισαγάγει 25 εγγραφές χρηστών με εικονικά δεδομένα.
Τώρα, είμαστε έτοιμοι με μερικά εικονικά δεδομένα για να εκτελέσουμε χειρισμό φόρμας πίνακα δεδομένων. Θα χρησιμοποιήσω το jQuery Datatable για ολόκληρο το demo.
Συνιστάται: Πώς να δημιουργήσετε ένα αρχείο Zip με οποιοδήποτε αρχείο και να το κατεβάσετε στο Laravel 9
Πώς να χρησιμοποιήσετε ομαδικές διαδρομές για τον ίδιο ελεγκτή στο Laravel 9
Δημιουργήστε έναν ελεγκτή
Στη συνέχεια, χρειαζόμαστε έναν ελεγκτή από τον οποίο θα αποδώσουμε δεδομένα στην προβολή και, στη συνέχεια, μπορούμε να εκτελέσουμε την υποβολή φόρμας πίνακα δεδομένων στο Laravel 9.
php artisan make:controller UserControllerΗ παραπάνω εντολή θα δημιουργήσει το UserController. Αφού δημιουργήσετε το χειριστήριο, απλώς τοποθετήστε μερικά αποσπάσματα σε αυτό όπως φαίνεται παρακάτω.
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use App\Models\User;
class UserController extends Controller
{
/**
* Function : Users Listing
*
* @param Request $request
* @return void
*/
public function index(Request $request) {
$users = User::all();
return view('users', compact('users'));
}
}Στο παραπάνω απόσπασμα, μόλις πρόσθεσα μια συνάρτηση για τη λήψη δεδομένων χρηστών και την επιστροφή τους στο αρχείο blade. Στη συνέχεια, πρέπει να δημιουργήσετε μια προβολή (blade) στην οποία μπορείτε να αποδώσετε τη λίστα των δεδομένων χρηστών.
Δημιουργήστε μια προβολή για χειρισμό φόρμας πίνακα δεδομένων
<!doctype html>
<html lang="en">
<head>
<title>Laravel 9 - DataTable Form Handling</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="csrf-token" content="{{ csrf_token() }}">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<link href="https://cdn.datatables.net/1.10.16/css/jquery.dataTables.min.css" rel="stylesheet">
<link href="https://cdn.datatables.net/1.10.19/css/dataTables.bootstrap4.min.css" rel="stylesheet">
</head>
<body>
<div class="container">
<h3 class="text-center font-weight-bold">Datatable Form Handling in Laravel 9 </h3>
<table class="table mt-2" id="users-table">
<thead>
<th> # </th>
<th> Name </th>
<th> Email </th>
<th> Address </th>
</thead>
<tbody>
@forelse ($users as $key => $user)
<tr>
<input type="hidden" name="userIds[]" value="{{$user->id}}" />
<td>{{$user->id}}</td>
<td>{{$user->name}}</td>
<td>{{$user->email}}</td>
<td>{{$user->address}}</td>
</tr>
@empty
<tr>
<td colspan="4"><span class="text-danger">No data found</span></td>
</tr>
@endforelse
</tbody>
</table>
</div>
<script src="https://code.jquery.com/jquery-3.5.0.js" integrity="sha256-r/AaFHrszJtwpe+tHyNi/XCfMxYpbsRg2Uqn0x3s2zc=" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
<script src="https://cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/1.10.19/js/dataTables.bootstrap4.min.js"></script>
<script>
$(document).ready(function() {
const table = $('#users-table').DataTable();
});
</script>
</body>
</html>
Στο παραπάνω αρχείο blade, έχω επαναλάβει τα δεδομένα των χρηστών και έχω προετοιμάσει τον πίνακα δεδομένων για αυτό. Επίσης, έχω προσθέσει μια κρυφή είσοδο μέσα στον βρόχο ώστε να μπορούμε να έχουμε το user id όλων των χρηστών.
Τώρα, ανάλογα, πρέπει να δημιουργήσουμε διαδρομές.
Πώς να εκκαθαρίσετε την προσωρινή μνήμη εφαρμογών χωρίς γραμμή εντολών στο Laravel
Προσθήκη διαδρομής
<?php
use Illuminate\Support\Facades\Route;
use App\Http\Controllers\UserController;
Route::get('users', [UserController::class, 'index'])->name('users');Αφού δημιουργήσουμε τη διαδρομή, ας ελέγξουμε την εφαρμογή.
Πλοηγηθείτε στην καθορισμένη διαδρομή και δείτε το αποτέλεσμα. Θα έχετε τον πίνακα δεδομένων με τη λίστα των σειρών.
Λοιπόν, πήραμε δεδομένα στον πίνακα δεδομένων. Τώρα, πρέπει να εκτελέσουμε χειρισμό φόρμας για την κρυφή είσοδο όπως ορίσαμε για το αναγνωριστικό χρήστη.
Έτσι, στο πρώτο βήμα, θα τυλίξω ολόκληρο τον πίνακα μέσα σε μια φόρμα με μια ενέργεια και θα προσθέσω ένα κουμπί υποβολής μέσα σε αυτήν για να υποβάλω το αναγνωριστικό χρήστη.
Συνιστάται: Πώς να ανεβάσετε εικόνα χρησιμοποιώντας τον Ajax στο Laravel 9 με επικύρωση
Χειρισμός φορμών στον πίνακα δεδομένων
Αφού προσθέσετε τη φόρμα και το κουμπί υποβολής, το αρχείο blade θα γίνει έτσι.
<!doctype html>
<html lang="en">
<head>
<title>Laravel 9 - DataTable Form Handling</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="csrf-token" content="{{ csrf_token() }}">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<link href="https://cdn.datatables.net/1.10.16/css/jquery.dataTables.min.css" rel="stylesheet">
<link href="https://cdn.datatables.net/1.10.19/css/dataTables.bootstrap4.min.css" rel="stylesheet">
</head>
<body>
<div class="container">
<h3 class="text-center font-weight-bold">Datatable Form Handling in Laravel 9 </h3>
<form action="{{route('users.store')}}" method="POST" id="datatable-form">
@csrf
<button type="submit" class="btn btn-primary float-right my-3">Submit</button>
<table class="table mt-2" id="users-table">
<thead>
<th> # </th>
<th> Name </th>
<th> Email </th>
<th> Address </th>
</thead>
<tbody>
@forelse ($users as $key => $user)
<tr>
<input type="hidden" name="userIds[]" value="{{$user->id}}" />
<td>{{$user->id}}</td>
<td>{{$user->name}}</td>
<td>{{$user->email}}</td>
<td>{{$user->address}}</td>
</tr>
@empty
<tr>
<td colspan="4"><span class="text-danger">No data found</span></td>
</tr>
@endforelse
</tbody>
</table>
</form>
</div>
<script src="https://code.jquery.com/jquery-3.5.0.js" integrity="sha256-r/AaFHrszJtwpe+tHyNi/XCfMxYpbsRg2Uqn0x3s2zc=" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
<script src="https://cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/1.10.19/js/dataTables.bootstrap4.min.js"></script>
<script>
$(document).ready(function() {
const table = $('#users-table').DataTable();
});
</script>
</body>
</html>
Αφού αλλάξετε τον κωδικό, πρέπει να προσθέσετε μια ακόμη διαδρομή για τον χειριστή υποβολής. Οι διαδρομές λοιπόν (web.php) το αρχείο θα γίνει έτσι.
Route::get('users', [UserController::class, 'index'])->name('users');
Route::post('users', [UserController::class, 'store'])->name('users.store');Επίσης, πρέπει να ενημερώσετε το UserController προσθέτοντας μία συνάρτηση υποβολής όπως φαίνεται παρακάτω.
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use App\Models\User;
class UserController extends Controller
{
/**
* Function : Users Listing
*
* @param Request $request
* @return void
*/
public function index(Request $request) {
$users = User::all();
return view('users', compact('users'));
}
/**
* Function : Store User
*
* @param Request $request
* @return void
*/
public function store(Request $request) {
dd($request->all());
}
}
Τώρα, απλώς ανανεώστε τη σελίδα για να δείτε το ενημερωμένο αποτέλεσμα.
Εδώ, έχουμε το υποβάλλουν κουμπί μέσα στη φόρμα.
Τώρα, ας προσπαθήσουμε να υποβάλουμε τις σειρές του πίνακα δεδομένων.
Κατά την υποβολή, θα λάβετε την παραπάνω απάντηση καθώς προσθέσαμε τη συνάρτηση dump and die για να δείτε το αίτημα φόρμας που υποβλήθηκε. Εδώ, μπορείτε να παρατηρήσετε, έχουμε μόνο 10 σειρές από τις 25. Αυτό είναι το πραγματικό πρόβλημα γιατί θέλουμε να υποβάλουμε όλες τις σειρές από τον πίνακα δεδομένων. Αλλά υπέβαλε μόνο τις πρώτες σειρές σελίδας που ήταν ορατές στο DOM.
Τώρα, ας έρθουμε στο μέρος της λύσης.
Αποσυνδεθείτε από πολλαπλές περιόδους ελέγχου ταυτότητας από άλλες συσκευές στο Laravel 9
Χειρισμός υποβολής φόρμας πίνακα δεδομένων με χρήση jQuery
Τώρα, θα ενημερώσουμε τον κώδικα γρήγορα.
- Αρχικά, θα αλλάξουμε το όνομα του εισαγωγή κρύβεται μέσα στον πίνακα και το κάνει μοναδικό για κάθε σειρά.
- Στη συνέχεια θα δημιουργήσουμε ένα Υποβολή φόρμας jQuery εκδήλωση και σε αυτό, θα το κάνουμε σειριοποιώ όλες οι διαθέσιμες εισροές μέσα στον πίνακα.
<input type="hidden" name="{{'userId_'.$key}}" value="{{$user->id}}" /><script>
$(document).ready(function() {
const table = $('#users-table').DataTable();
$("#datatable-form").submit(function(e) {
// serialize all inputs inside the table
const formData = table.$('input').serializeArray();
// iterate all rows
$.each(formData, function(index, field) {
// append all user id in hidden input
$("#datatable-form").append($(`<input type="hidden" name="${this.name}" value="${this.value}">`));
});
});
});
</script>Έτσι, το συνολικό τελικό απόσπασμα έγινε όπως φαίνεται παρακάτω.
<!doctype html>
<html lang="en">
<head>
<title>Laravel 9 - DataTable Form Handling</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="csrf-token" content="{{ csrf_token() }}">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<link href="https://cdn.datatables.net/1.10.16/css/jquery.dataTables.min.css" rel="stylesheet">
<link href="https://cdn.datatables.net/1.10.19/css/dataTables.bootstrap4.min.css" rel="stylesheet">
</head>
<body>
<div class="container">
<h3 class="text-center font-weight-bold">Datatable Form Handling in Laravel 9 </h3>
<form action="{{route('users.store')}}" method="POST" id="datatable-form">
@csrf
<button type="submit" class="btn btn-primary float-right my-3">Submit</button>
<table class="table mt-2" id="users-table">
<thead>
<th> # </th>
<th> Name </th>
<th> Email </th>
<th> Address </th>
</thead>
<tbody>
@forelse ($users as $key => $user)
<tr>
<input type="hidden" name="{{'userId_'.$key}}" value="{{$user->id}}" />
<td>{{$user->id}}</td>
<td>{{$user->name}}</td>
<td>{{$user->email}}</td>
<td>{{$user->address}}</td>
</tr>
@empty
<tr>
<td colspan="4"><span class="text-danger">No data found</span></td>
</tr>
@endforelse
</tbody>
</table>
</form>
</div>
<script src="https://code.jquery.com/jquery-3.5.0.js" integrity="sha256-r/AaFHrszJtwpe+tHyNi/XCfMxYpbsRg2Uqn0x3s2zc=" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
<script src="https://cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/1.10.19/js/dataTables.bootstrap4.min.js"></script>
<script>
$(document).ready(function() {
const table = $('#users-table').DataTable();
$("#datatable-form").submit(function(e) {
// serialize all inputs inside the table
const formData = table.$('input').serializeArray();
// iterate all rows
$.each(formData, function(index, field) {
// append all user id in hidden input
$("#datatable-form").append($(`<input type="hidden" name="${this.name}" value="${this.value}">`));
});
});
});
</script>
</body>
</html>
Τώρα, απλώς ανανεώστε τη σελίδα και δείτε τα ενημερωμένα αποτελέσματα.
Εδώ, στον ελεγκτή, μπορείτε να δείτε όλες τις σειρές (25 μετρήσεις) να υποβάλλονται με το ευρετήριο. Έτσι, από εδώ, μπορείτε εύκολα να επαναλάβετε αυτές τις σειρές για αποθήκευση.
Συνιστάται: Πώς να εγκαταστήσετε και να ρυθμίσετε το PHP Composer στο MacOS
Για αυτό, μπορούμε να περάσουμε μια ακόμη κρυφή είσοδο για τον αριθμό των σειρών και με βάση αυτό το πλήθος, μπορούμε να κάνουμε μια επανάληψη βρόχου για να εξαγάγουμε όλες τις εισόδους στον ελεγκτή.
Λοιπόν, ας ενημερώσουμε γρήγορα το μέρος του σεναρίου.
<script>
$(document).ready(function() {
const table = $('#users-table').DataTable();
const countRows = [];
$("#datatable-form").submit(function(e) {
// serialize all inputs inside the table
const formData = table.$('input').serializeArray();
// iterate all rows
$.each(formData, function(index, field) {
// pushing total counts of the user id input
if ((field.name).indexOf('userId_') !== -1) {
countRows.push(index);
}
// append all user id in hidden input
$("#datatable-form").append($(`<input type="hidden" name="${this.name}" value="${this.value}">`));
});
// append count of rows
$("#datatable-form").append($(`<input type="hidden" name="rowsCount" value="${countRows.length}">`));
});
});
</script>Στο παραπάνω σενάριο, προσθέσαμε μια ακόμη κρυφή είσοδο για το πλήθος του ονόματος εισόδου που έχει userId. Έτσι, στο αίτημα μέσα στον ελεγκτή, θα λάβουμε ένα επιπλέον πεδίο.
Τώρα, με βάση αυτό το πεδίο μέτρησης, μπορούμε να αντιστοιχίσουμε αυτές τις σειρές με τη μορφή πίνακα. Για να μπορούμε να αποθηκεύσουμε τα δεδομένα στον πίνακα ή να κάνουμε και άλλες ενέργειες.
Υποβλήθηκαν σειρές φόρμας πίνακα δεδομένων χάρτη
Λοιπόν, ας κάνουμε μερικά ενημερώσεις στο κατάστημα() λειτουργία μέσα στο UserController.
/**
* Function : Store User
*
* @param Request $request
* @return void
*/
public function store(Request $request) {
$formRequests = [];
if ($request->rowsCount > 0) {
for ($i = 0; $i < $request->rowsCount; $i++) {
$formRequests[] = [
'user_id' => $request->input('userId_'.$i),
];
}
}
dd($formRequests);
}Τώρα, ανανεώστε τη σελίδα για να δείτε το τελικό αποτέλεσμα.
Τώρα, απλοποιήσαμε τα δεδομένα αιτήματος με τη μορφή πίνακα, ώστε να μπορούμε να τα εισαγάγουμε στον πίνακα της βάσης δεδομένων.
συμπέρασμα
Τέλος, πετύχαμε το αποτέλεσμα της υποβολής φόρμας πίνακα δεδομένων στο Laravel 9. Είδαμε βήμα προς βήμα, πώς ο πίνακας δεδομένων αποδίδει μόνο τις ορατές σειρές και κατά την υποβολή του αιτήματος υποβάλλονται οι ορατές σειρές. Ωστόσο, επιτύχαμε την υποβολή όλων των γραμμών σειριοποιώντας όλες τις εισόδους από τον συγκεκριμένο πίνακα και προσαρτήθηκαν στη φόρμα. Έτσι, κατόπιν αιτήματος υποβολής, λάβαμε όλες τις σειρές από αυτόν τον πίνακα δεδομένων.
Αυτά για αυτήν την ανάρτηση. Ελπίζω να σας φανεί χρήσιμος σε αυτήν την ανάρτηση.
