VaKeR CYBER ARMY
Logo of a company Server : Apache/2.4.41 (Ubuntu)
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 :
current_dir [ Writeable ] document_root [ Writeable ]

 

Current File : /var/www/html/libs/absol-acomp/demo/datetimeinput.html
<!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>

VaKeR 2022