របៀបបង្កើត Datepicker ជាមួយ Javascript

in cambodia •  7 years ago 

datepicker.png

កាផ្តល់ភាពងាយស្រួលក្នុងការជ្រើសរើសថ្ងៃ ខែ ឆ្នាំ ម៉ោងសំរាប់បំពេញបែបបទអ្វីមួយ គឺជារឿងចាំបាច់។ ក្នុងអត្ថបទនេះ ខ្ញុំនឹងបង្ហាញពីរបៀបជ្រើសរើសថ្ងៃ ខែ ឆ្នាំ ម៉ោង នៅលើវេបសាយ។

ចំណាំ: មុខងារទាំងអស់ត្រូវបានចូលដំណើរការតាមរយៈទិន្នន័យ attribute ឧទាហរណ៍ $ ( "# datetimepicker ") ។ ទិន្នន័យ ("DateTimePicker") FUNCTION()។

១) ការដំឡើងជាអប្បបរមា (Minimum Setup)

date-picker001.png

កូដ

date-picker-coding001.png
date-picker-coding101.png

២) ការប្រើប្រាស់ក្នុង local (Using Locales)

local-date.png

កូដ

local-date-coding.png
local-date-coding01.png

៣) ទ្រង់ទ្រាយផ្ទាល់ខ្លួន (Custom Formats)

date-picker001.png

កូដ

date-picker-coding002.png
date-picker-coding102.png

៤) គ្មានរូបតំណាង (បញ្ចូលតែវាលប៉ុណ្ណោះ): (No Icon (input field only))

no-icon.png

កូដ

no-icon-coding.png
no-icon-coding01.png

៥) បើក/ បិទ កាលបរិច្ឆេទ (Enabled/Disabled Dates)

Enabled-Disabled-Dates.png

កូដ

Enabled-Disabled-Dates001.png
Enabled-Disabled-Dates101.png

៦) ជ្រើសយកតភ្ជាប់ (Linked Pickers)

Linked-Pickers.png

កូដ

Linked-Pickers-coding001.png
Linked-Pickers-coding101-1.png

៧) រូបតំណាងផ្ទាល់ខ្លួន (Custom Icons)

custom-icon.png

កូដ

custom-icon-coding.png
custom-icon-coding01.png

៨) របៀបមើល (View Mode)

View-Mode.png

កូដ

View-Mode-coding001.png
View-Mode-coding101.png

៩) របៀបមើលនាទី (Min View Mode)

min-view-mode.png

កូដ

min-view-mode-coding.png
min-view-mode-coding01.png

១០) បិទថ្ងៃមួយចំនួននៃសប្តាហ៍ (Disabled Days of the Week)

disable-date-of-the-week.png

កូដ

disable-date-of-the-week-coding001.png
disable-date-of-the-week-coding101.png

១១) ក្នុងជួរ (Inline)

inline.png

កូដ

inline-coding001.png
inline-coding101.png

ប្រភពដើម

Authors get paid when people like you upvote their post.
If you enjoyed what you read here, create your account today and start earning FREE STEEM!