![]() System : Linux absol.cf 5.4.0-198-generic #218-Ubuntu SMP Fri Sep 27 20:18:53 UTC 2024 x86_64 User : www-data ( 33) PHP Version : 7.4.33 Disable Function : pcntl_alarm,pcntl_fork,pcntl_waitpid,pcntl_wait,pcntl_wifexited,pcntl_wifstopped,pcntl_wifsignaled,pcntl_wifcontinued,pcntl_wexitstatus,pcntl_wtermsig,pcntl_wstopsig,pcntl_signal,pcntl_signal_get_handler,pcntl_signal_dispatch,pcntl_get_last_error,pcntl_strerror,pcntl_sigprocmask,pcntl_sigwaitinfo,pcntl_sigtimedwait,pcntl_exec,pcntl_getpriority,pcntl_setpriority,pcntl_async_signals,pcntl_unshare, Directory : /var/www/html/libs/absol-acomp/demo/ |
Upload File : |
<!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1.0,minimum-scale=1.0, user-scale=no"> <title>Date Time Input</title> <meta charset="UTF-8"> <script src="../dist/absol-acomp.js?<?php echo stat('../dist/absol-acomp.js')['mtime'];?>"></script> </head> <body> <h1>Date Time Input</h1> <div class="input-demo"> <style> :root{ font-size: 14px; } </style> </div> <script> </script> <script class="viewable"> (function () { var _ = absol._; var $ = absol.$; var inputDemoDiv = $('.input-demo'); var supportFormats = [ 'd/MM/yyyy', 'dd/MM/yyyy', 'dd-MM-yyyy', 'dd.MM.yyyy', 'yyyy/MM/dd', 'yyyy-MM-dd', 'MM/dd/yyyy']; supportFormats.forEach(function (format) { _( { style: { 'margin-bottom': '10px' }, child: [ { tag: 'label', style: { width: '10em', 'line-height': '30px', display: 'inline-block' }, child: { text: format } }, { tag: 'datetimeinput', props: { value: new Date(), format: format }, on: { change: function () { absol.require('snackbar').show(this.value + ''); } } }, { tag: 'label', style: { width: '10em', 'line-height': '30px', display: 'inline-block' }, child: { text: format + ' hh:mm a' } }, { tag: 'datetimeinput', props: { value: new Date(), format: format + ' hh:mm a' }, on: { change: function () { absol.require('snackbar').show(this.value + ''); } } }, { tag: 'datetimeinput', props: { value: new Date(), format: format + ' hh:mm a', notNull: true }, on: { change: function () { absol.require('snackbar').show(this.value + ''); } } }, { tag: 'datetimeinput', props: { value: new Date(), format: format + ' hh:mm a', notNull: true, disabled: true }, on: { change: function () { absol.require('snackbar').show(this.value + ''); } } } ] } ).addTo(inputDemoDiv); }); _( { style: { 'margin-bottom': '10px' }, child: [ { tag: 'label', style: { width: '10em', 'line-height': '30px', display: 'inline-block' }, child: { text: 'default' } }, { tag: 'datetimeinput', props: { }, on: { change: function () { absol.require('snackbar').show(this.value + ''); } } }, { tag: 'datetimeinput', props: { notNull: true }, on: { change: function () { absol.require('snackbar').show(this.value + ''); } } }, { tag: 'datetimeinput', props: { notNull: true, disabled: true }, on: { change: function () { absol.require('snackbar').show(this.value + ''); } } } ] } ).addTo(inputDemoDiv); _( { style: { 'margin-bottom': '10px' }, child: [ { tag: 'label', style: { width: '10em', 'line-height': '30px', display: 'inline-block' }, child: { text: 'default' } }, { tag: 'datetimeinput', props: { format:'dd/MM/yyyy HH:mm' }, on: { change: function () { absol.require('snackbar').show(this.value + ''); } } }, { tag: 'datetimeinput', props: { format:'dd/MM/yyyy HH:mm', notNull: true }, on: { change: function () { absol.require('snackbar').show(this.value + ''); } } }, { tag: 'datetimeinput', props: { notNull: true, disabled: true, format:'dd/MM/yyyy HH:mm' }, on: { change: function () { absol.require('snackbar').show(this.value + ''); } } } ] } ).addTo(inputDemoDiv); })(); </script> </body> </html>