HTML Collective - Phần 1
Bài đăng này đã không được cập nhật trong 7 năm
I. Giới thiệu và hướng dẫn cài đặt
HTML Collective là một package hỗ trợ cho Laravel xây dựng lên các Form HTML, để cài đặt pakage này trên Laravel, chúng ta sử dụng câu lệnh sau (dành cho những bạn sử dụng composer) :
composer require "laravelcollective/html":"^5.3.0"
Sau khi composer thực thi xong chúng ta vào thư mục config/app.php
và thêm trong mục providers
như sau:
'providers' => [
// ...
Collective\Html\HtmlServiceProvider::class,
// ...
],
Cuối cùng, cũng trong thư mục config/app.php
chúng ta thêm vào mục aliases
như sau:
'aliases' => [
// ...
'Form' => Collective\Html\FormFacade::class,
'Html' => Collective\Html\HtmlFacade::class,
// ...
],
II. Sử dụng Form trong HTML Collective
Cú pháp để sử dụng một form như sau
{!! Form::open(['url' => 'foo/bar']) !!}
//
{!! Form::close() !!}
Mặc định phương thức sử dụng khi chúng ta open một form bằng HTML collective sẽ là POST, tất nhiên chúng ta hoàn toàn có thể tùy chỉnh các phương thức mà ta mong muốn, ví dụ như:
{!! Form::open(['url' => 'foo/bar', 'method' => 'put']) !!}
//
{!! Form::close() !!}
Chú ý: Trong HTML, chỉ hỗ trợ hai phương thức POST và GET trong
<form> </form>
, các phương thức PUT và DELETE sẽ tự động được thêm vào một_method
ẩn trong form của bạn. Trong form bạn có thể trỏ tới action trong controller hoặc route bằng cách:
echo Form::open(['route' => 'route.name'])
echo Form::open(['action' => 'Controller@method'])
Và giả sử, trong form bạn gửi lên có chứa files
bạn có thể khai báo như sau:
echo Form::open(['url' => 'foo/bar', 'files' => true])
III. Form Model Binding
1. Sử dụng một Model Form
Sử dụng Form Model, bạn có thể lấy các giá trị trong Model để điền vào form một cách thuận tiện, chúng ta sử dụng phương thức Form::model
để làm việc đó:
echo Form::model($user, ['route' => ['user.update', $user->id]])
Bây giờ, khi bạn muốn tạo ra một phần tử chẳng hạn như một text input, thì giá trị của trường trong model sẽ khớp với thuộc tính name của input đó, và tự động điền giá trị lấy từ Models ra rồi điền vào ô input tương ứng.
Ví dụ bây giờ trong Model user
có trường email
trong Form có input
có name là email
, thì tự động giá trị của trường email
sẽ điền vào ô input đó. Và hơn nữa, nếu có một item trong dữ liệu Session khớp với name của input
đó thì nó sẽ ưu tiên điền giá trị của trường trong Session vào trong input
. Ví dụ như khi bạn cập nhật tài khoản cá nhân, khi bạn nhập sai một trường nào đó, trang sẽ load lại và trả về thông báo "cập nhật thất bại" nhưng các giá trị trước khi bạn cập nhật tại các ô input vẫn sẽ được giữ nguyên như lần trước. Và thứ tự ưu tiên sẽ như sau:
Session Flash Data (Old Input)
Explicitly Passed Value
Model Attribute Data
Điều này không những cho phép bạn xây dựng nhanh chóng các Form, điền dữ liệu theo model mà còn giúp bạn dễ dàng điền lại các dữ liệu cũ nếu bạn không được server xác nhận thành công.
Nếu bạn sử dụng
Form::model
, hãy nhớ đóng lại bằngForm::close
!
2. Form Model Accessors
Như chúng ta biết Eloquent Accessor
của Laravel cho phép người dùng thao tác với các dữ liệu trước khi đưa ra giá trị trả về. Chẳng hạn trong trường name
ở bảng User
chỉ lưu tên dạng 'nguyen van a' thì khi bạn sử dụng Eloquent Accessor
bạn có thể trả về name
dưới dạng Nguyen Van A". Đặc biệt, nó rất hữu ích cho việc xác định định dạng ngày tháng. Ví dụ như giá trị trả về từ DB có định dạng mm/dd/yyyy nhưng trên form sẽ hiển thị kiểu dd/mm/yyyy thì bạn phải viết hai Accessor riêng biệt: một accessor tiêu chuẩn, và một accessor form.
Để sử dụng form accessors, đầu tiên bạn thêm vào FormAccessible
bên trong class model sau đó tạo ra một phương thức formFooAttribute
bên trong model và ở đây Foo là tên một thuộc tính trong model đó, và trong Eloquent Accessor
các accessor sẽ được đặt tên theo kiểu "camel-cased", trong đó thành phần ở giữa viết hoa chỉ định ra thuộc tính bên trong model. Trong ví dụ sau đây, ta cần lấy ra accessor của thuộc tính date_of_birth
. Thì ở đây accessor sẽ tự động gọi bởi HTML Form Builder nếu ta muốn điền một trường vào trong form khi sử dụng Form::model()
<?php
namespace App;
use Carbon\Carbon;
use Illuminate\Database\Eloquent\Model;
use Collective\Html\Eloquent\FormAccessible;
class User extends Model
{
use FormAccessible;
/**
* Get the user’s date of birth.
*
* @param string $value
* @return string
*/
public function getDateOfBirthAttribute($value)
{
return Carbon::parse($value)->format('m/d/Y');
}
/**
* Get the user's date of birth for forms.
*
* @param string $value
* @return string
*/
public function formDateOfBirthAttribute($value)
{
return Carbon::parse($value)->format('Y-m-d');
}
}
IV. CSRF Protection
Để hiểu về CSRF thì các bạn có thể tham khảo nhiều nguồn. Ở đây để ủng hộ anh em trong nhà mình xin đưa ra bài viết của bạn Nguyen Van Linh )))) https://viblo.asia/vanlinh/posts/amoG84bOGz8P
Nếu bạn sử dụng Form::open
hoặc Form::model
với các method POST, PUT, DELETE thì CSRF token sẽ được sử dụng bởi Laravel với mục đích tạo ra một CSRF Protection ẩn trong form của bạn một cách tự động. Ngoài ra nếu bạn muốn tạo ra một HTML có chưa CSRF bạn có thể sử dụng cú pháp sau:
echo Form::token();
Kết thúc
Trên đây là một vài chia sẻ của mình về HTML Collective, nếu có gì sai sót chúng ta hãy cùng thảo luận. Cảm ơn các bạn, Gods bless for u !
All rights reserved