CODEWITHSUNDEEP
javascriptjquerydatepicker
Cameron Castillo
Cameron Castillo

Reputation: 2832

Allow typing of time when Jquery datepicker are used

I have an HTML textbox that uses a datepicker.

<script type="text/javascript">
    $(function () {
        $("#<%= txtDateFrom.ClientID  %>").datepicker({ dateFormat: 'yy/mm/dd' });
    });

I would like users to optionally type in a time as well. Currently users can edit the textbox, but only the date part.

Upvotes: 3

Views: 3701

Answers (2)

Max Malyk
Max Malyk

Reputation: 860

As Rory commented already, there is no time included in jquery ui datepicker plugin, but using the one created by Trent Richardson (http://trentrichardson.com) you could achieve what you are looking for.

I am using this very plugin often in various projects, I am used to have a date class initialized somewhere in a Master view:

    $('.date').datetimepicker({
        showOn: "both",
        buttonImage: '<%:Url.Image("calendar.gif")%>',
        buttonImageOnly: true,
        ampm: true,
        timeFormat: 'hh:mm:ss TT'
    });

here is a snapshot i just took, note it has two date fields, the input is completely free type, time is added either manually or using scrolls under the calendar inside popup:

datetimepicker plugin usage

Upvotes: 1

Vinod VT
Vinod VT

Reputation: 7149

Use this

<script type="text/javascript">
$(function () {
     $("#<%= txtDateFrom.ClientID  %>").datepicker({ dateFormat: 'yy/mm/dd', constrainInput: false });
});
</script>

constrainInput: false allows anything can be typed in the text field

Upvotes: 6

Related Questions