Thêm đá quý “bootstrap3-datetimepicker-rail” Thời gian dữ liệu trong đường ray

Tram Ho

1. Giới thiệu

Datepicker là một dạng component đã quá quen thuộc với các bạn làm front-end, là một thư viện js hỗ trợ tạo ra các datefield , daterange, được sử dụng rộng rãi trên rất nhiều ứng dụng web. Mục đích của nó là hiển thị một tờ lịch trên màn hình máy tính để người dùng có thể chọn ngày tháng một cách dễ dàng.

2. Các bước thực hiện

Tạo project:

Thêm vào gem file:

thêm vào file app/assets/javascripts/application.js

Tạo thêm 1 file: Touch app/assets/stylesheets/custom.scss
và import:

Tiếp tục thêm vào file application.css

tạo model:

sau đó

Thêm vào file routes:

Tạo file: Touch app/assets/javascripts/datetimepicker.js
và thêm nội dung sau:

Với format : “dd/mm/YYYY”

Thêm nội dung sau vào file datetimepicker.js

Khi custom với format: only time
Thêm nội dung sau vào file datetimepicker.js

Custom với field hiện thị không có icon

Thay đổi file datetimepicker.js

Khi Enabled/Disabled: để ngày mặc định: 11/1/2019, ngày hiện tại: 12/20/2019 sẽ được select, ngày: 12/21/2019 và 12/22/2019 bị disable.

Với view mode hiển thị năm trên view thì sửa lại datetimepicker.js như sau:

Trên đây là các bước add gem “bootstrap3-datetimepicker-rail” vào ứng dụng rails. Bài viết còn nhiều thiếu sót rất mong được mọi người góp ý.

Chia sẻ bài viết ngay

Nguồn bài viết : Viblo