Set Default Date in HTML Input Date in AngularJS

mahesh213
 
on Feb 17, 2020 11:50 PM
Sample_181388.zip
1605 Views

Hi,

How to load 1st day of month by default on datefield

after loading of page need to display by default start day of month in date field.

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" />
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.5/angular.js"></script>
    <script type="text/javascript">
        var app = angular.module('MyApp', [])
        app.controller('MyController', function ($scope, $http, $window) {
        });
    </script>
</head>
<body ng-app="MyApp" ng-controller="MyController">
    Date:<input type="date"  ng-model="Date"/>
</body>
</html>
Download FREE API for Word, Excel and PDF in ASP.Net: Download
dharmendr
 
on Feb 18, 2020 02:03 AM

Hi mahesh213,

Check the below sample code.

HTML

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>AngularJS: Input Type Date Set Date</title>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.5/angular.js"></script>
    <script type="text/javascript">
        var app = angular.module('MyApp', [])
        app.controller('MyController', function ($scope) {
            var firstDay = new Date(new Date().getFullYear(), new Date().getMonth(), 1);
            var lastDay = new Date(new Date().getFullYear(), new Date().getMonth() + 1, 0);
            $scope.StartDate = firstDay;
            $scope.EndDate = lastDay;
        });
    </script>
</head>
<body ng-app="MyApp" ng-controller="MyController">
    Start Date : <input type="date" ng-model="StartDate" />
    End Date : <input type="date" ng-model="EndDate" />
</body>
</html>

Demo