Posted tagged ‘datepicker’

Laravel Datepicker Datetimepicker

April 27, 2017

การใช้งาน DatePicker, DatetimePicker.

 

Download

 

** หาข้อมูลได้จาก https://cdnjs.com/

DatePicker จะมีเพียงวันที่เท่านั้น ดาว์นโหลดข้อมูลได้จากเว็บ

https://github.com/uxsolutions/bootstrap-datepicker

DateTimePicker จะมีวันที่และเวลา

https://github.com/smalot/bootstrap-datetimepicker

 

การตั้งค่า Laravel

Unzip files ที่ดาวน์โหลดได้จากเว็บ แล้วไปเก็บไว้ที่

D:\proj\web\blog\node_modules

เช่น

D:\proj\web\blog\node_modules\bootstrap-datetimepicker

D:\proj\web\blog\node_modules\bootstrap-datepicker

 

แก้ไขไฟล์ D:\proj\web\blog\resources\assets\js\bootstrap.js

window.$ = window.jQuery = require(‘jquery’);

require(‘bootstrap-sass’);

addè require(‘bootstrap-datepicker’);

addè require(‘bootstrap-datetimepicker’);

Run >> sudo npm run dev

 

CSS ไปวางไปที่ folder public

CSS ที่ได้จากการดาวน์โหลด เข้าไปหาใน dist\css

D:\proj\web\blog\public\css

Bootstrap-datepicker3.css

Bootstrap-datetimepicker.css

แก้ไข master.blade.php

D:\proj\web\blog\resources\views\layouts\master.blade.php

<!– Bootstrap core CSS –>

<link href=”/css/app.css” rel=”stylesheet”>

<link href=”/css/bootstrap-datepicker3.css” rel=”stylesheet”>

<link href=”/css/bootstrap-datetimepicker.css” rel=”stylesheet”>

 

The end.