jQuery UI Widgets Forums Editors DateTimeInput Can datetimeinput be only selected, not editable by keyboard?

This topic contains 3 replies, has 4 voices, and was last updated by  selva 7 years, 4 months ago.

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author

  • yuanru
    Participant

    Hi,

    I need a widget which can only be edited by selecting date. But I didn’t find any option to disable keyboard editing function in datetimeinput.

    Thanks!


    Nadezhda
    Participant

    Hello yuanru,

    Here is an example which shows how to stop keyboard editing.

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <title></title>
        <link rel="stylesheet" href="../../jqwidgets/styles/jqx.base.css" type="text/css" />
        <script type="text/javascript" src="../../scripts/jquery-1.11.1.min.js"></script>
        <script type="text/javascript" src="../../scripts/demos.js"></script>
        <script type="text/javascript" src="../../jqwidgets/jqxcore.js"></script>
        <script type="text/javascript" src="../../jqwidgets/jqxdatetimeinput.js"></script>
        <script type="text/javascript" src="../../jqwidgets/jqxcalendar.js"></script>
        <script type="text/javascript" src="../../jqwidgets/jqxtooltip.js"></script>
        <script type="text/javascript" src="../../jqwidgets/globalization/globalize.js"></script>
    </head>
    <body> 
        <div id='content'>
            <script type="text/javascript">
                $(document).ready(function () {               
                    // Create a jqxDateTimeInput
                    $("#jqxWidget").jqxDateTimeInput({ width: '250px', height: '25px' });
                    $("#inputjqxWidget").focus(function () {
                        $(this).blur();
                    });
                });
            </script>
            <div id='jqxWidget'>
            </div>
        </div>
    </body>
    </html>

    Best Regards,
    Nadezhda

    jQWidgets team
    http://www.jqwidgets.com/


    Peter Stoev
    Keymaster

    Hi yuanru,

    Another solution is to set readonly to true – http://jsfiddle.net/jqwidgets/yv5gR/

    Best Regards,
    Peter Stoev

    jQWidgets Team
    http://www.jqwidgets.com/


    selva
    Participant

    Hi Peter Stoev,

    I have two dateTimeInput elements like appointmentStartTime and appointmentEndTime.
    My scenario is restrict appointmentEndTime is not less than start time and also not greater than 8 hrs in a same day. And by default user after entering the appointment start time, then appointment End time is auto calculate to 1 hr from the start time. How can i achieve this.

Viewing 4 posts - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.