Want to use my own text box to display selected date - Angular, Vue, React, Web Components, Javascript, HTML5 Widgets

Tagged: date, datetimeinput, jqxdatetimeinput, textbox

This topic contains 4 replies, has 2 voices, and was last updated by abc 12 years ago.

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

Author

Want to use my own text box to display selected date Posts

January 30, 2013 at 7:15 am Want to use my own text box to display selected date #14324

abc

Participant

Hi,

I am using “jqxDateTimeInput” , in that i want to use my text box instead of default text area used for displaying selected date from DateTimeInput widget.

please tell me how to do this.

January 30, 2013 at 7:33 am Want to use my own text box to display selected date #14327

Peter Stoev

Keymaster

Hi abcd,

It is not possible to replace the jqxDateTimeInput’s input field with a custom one.

If you want to display the jqxDateTimeInput’s date in another textbox, take a look at the sample below:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <link rel="stylesheet" href="../../jqwidgets/styles/jqx.base.css" type="text/css" />
    <script type="text/javascript" src="../../scripts/jquery-1.8.2.min.js"></script>
    <script type="text/javascript" src="../../scripts/gettheme.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/jquery.global.js"></script>
</head>
<body>
    <div id='content'>
        <script type="text/javascript">
            $(document).ready(function () {
                var theme = getTheme();
                // Create a jqxDateTimeInput
                $("#jqxWidget").jqxDateTimeInput({ width: '250px', height: '25px', theme: theme });
                var date = $("#jqxWidget").jqxDateTimeInput('getDate');
                $("#textbox").val(date);
                $("#divbox").append("The date is " + date);
            });
        </script>
        <div id='jqxWidget'>
        </div>
        <input type="text" id="textbox" style="width: 300px;" />
        <div id="divbox">
        </div>
    </div>
</body>
</html>

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

January 30, 2013 at 9:08 am Want to use my own text box to display selected date #14337

abc

Participant

Hi Peter,

Thank you so much for your reply,

I did this, but using ‘getDate’ method i get the date in “Mon Dec 19 2005 00:00:00 GMT+0530 (India Standard Time)” this format
i want the date in same format as displayed in default text area.
Is it possible to take value from that text area directly or can we get the date in any required format from getDate method?

Thank you.

January 30, 2013 at 9:27 am Want to use my own text box to display selected date #14339

Peter Stoev

Keymaster

Hi abcd,

To take the date’s text directly as it is displayed, you can do this:

var text  = $("#jqxWidget").find('input').val();

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

January 30, 2013 at 9:45 am Want to use my own text box to display selected date #14343

abc

Participant

Hi Peter,

Thank you!
It’s realy works!

Author

Posts

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

You must be logged in to reply to this topic.