could not able to render current date in textbox

could not able to render current date in textbox - Jquery

I have input text box for date. I am using JQuery Date picker.
I want to set and render the current date in my text box when page loads as default.

I could not able to do it. This is my code. Its not working.

Please look at and help me out.

Date:

$(document).ready(function () {
$('#dtID').datepicker({
changeMonth: true,
changeYear: true,
showAnim: 'slideDown',
duration: 'fast',
dateFormat: 'mm/dd/yy',
onSelect: function (date) {
$scope.txtDate = date;
$scope.$apply();
}
}).setDate(new Date());
});

that's because setdate is a property, but you are using it as a function.

it should be written like:

.datepicker("setDate", new Date());

find below whole working code.

>
<html>
<head>
<title>title>
<meta charset="utf-8" />
<script src="scripts/jquery-3.1.1.min.js">script>
<script src="scripts/jquery-ui-1.12.1.min.js">script>
<script type="text/javascript">
$(document).ready(function () {
$('#dtID').datepicker({
changeMonth: true,
changeYear: true,
showAnim: 'slideDown',
duration: 'fast',
dateFormat: 'mm/dd/yy',
onSelect: function (date) {
$scope.txtDate = date;
$scope.$apply();
},
defaultDate: new Date()
}).datepicker("setDate", new Date());
});
script>
head>
<body>
<label for="dateSelection">Date:label>
<span style="background-color: antiquewhite; padding-top: 3.6px; padding-bottom: 3.6px;">
<input type="text" id="dtID" name="dateSelection" placeholder="mm/dd/yyyy" ng-model="txtDate" required />
<span class="glyphicon glyphicon-calendar" style="padding-right: 3.6px;">span>
span>
body>
html>

2 Replies

Know the answer? Post it — somebody with the same question will find it here.

Nilesh Shah9y ago
Accepted answer
that's because setdate is a property, but you are using it as a function.
it should be written like:
.datepicker("setDate", new Date());
find below whole working code.
>
<html>
<head>
    <title>title>
    <meta charset="utf-8" />

    <script src="scripts/jquery-3.1.1.min.js">script>
    <script src="scripts/jquery-ui-1.12.1.min.js">script>
    <script type="text/javascript">

        $(document).ready(function () {
            $('#dtID').datepicker({
                changeMonth: true,
                changeYear: true,
                showAnim: 'slideDown',
                duration: 'fast',
                dateFormat: 'mm/dd/yy',
                onSelect: function (date) {
                    $scope.txtDate = date;
                    $scope.$apply();
                },
                defaultDate: new Date()
            }).datepicker("setDate", new Date());
        });

    script>
head>
<body>
    <label for="dateSelection">Date:label>
    <span style="background-color: antiquewhite; padding-top: 3.6px; padding-bottom: 3.6px;">
        <input type="text" id="dtID" name="dateSelection" placeholder="mm/dd/yyyy" ng-model="txtDate" required />
        <span class="glyphicon glyphicon-calendar" style="padding-right: 3.6px;">span>
    span>
body>
html>
0
Mukil Vendhan9y ago
1. follow this syntax:$('#datefield').datetimepicker({
2. datepicker: true
3. });
kindly follow this link:http://www.kestrelblackmore.com/blog/jquery-datepicker-mvc4
link2:https://youtu.be/TgD24a9gxXw
0