AngularJS date in controller undefined

Question

I'm trying to add a date that defaults to the current day to my page. Below is the angular script for this but when I click add day I get error of undefined? I don't understand I believe it's been defined correctly.

$scope.today= new Date();
$scope.add = {};

       if($scope.today){
           var today= new Date($scope.today)
           $scope.add.today=
                today.getFullYear()+'-'+(today.getMonth() + 1)+'-'+today.getDate();
       }else{
           $scope.add.today= null;
       }

<div class="form-group col-sm-4">
      <label for="Date">Date</label>
      <input type="date" class="form-control" name="add_row_today" id="add_row_today" ng-model="today">
</div>

This is what my code looks like.

this is the stack trace from console

TypeError: Cannot set property 'today' of undefined
    at m.$scope.add_list (angularScripts.js?v=1.3:8741)
    at fn (eval at compile (_bower.js?v=1.2:10467), <anonymous>:4:220)
    at b (_bower.js?v=1.2:10360)
    at e (_bower.js?v=1.2:10510)
    at m.$eval (_bower.js?v=1.2:10379)
    at m.$apply (_bower.js?v=1.2:10380)
    at HTMLInputElement.<anonymous> (_bower.js?v=1.2:10510)
    at HTMLInputElement.dispatch (_bower.js?v=1.2:5201)
    at HTMLInputElement.elemData.handle (_bower.js?v=1.2:5009)

That error is coming from $scope.add.today = [...]. You are trying to set the property today on an object $scope.add that has not been defined. Please explain what you're trying to do with that line of code. — Lex
– Lex, Commented Jun 6, 2018 at 14:55
I just saw that I forgot to add that line. But pretty much I want a date to be entered and if no date is entered it just defaults to the current day. — Celestialchippy
– Celestialchippy, Commented Jun 6, 2018 at 14:57
Still won't work. You've now defined $scope.add as an empty object that has no property today. What you should do instead is $scope.add = { today: null }; — Lex
– Lex, Commented Jun 6, 2018 at 14:58
So if I have an option to edit the day as well would I change the date to null or just leave it empty? — Celestialchippy
– Celestialchippy, Commented Jun 6, 2018 at 15:02
@Lex you don't need to initialise a property, only an object — Aleksey Solovey
– Aleksey Solovey, Commented Jun 6, 2018 at 15:24

Aleksey Solovey · Accepted Answer · 2018-06-06 15:04:20Z

1

You have a typo.

property 'today' of undefined means something has .today, which doesn't exists. In your case it's either $scope.add or $scope.edit

I think while changing your code, you forgot to replace one of them. Try changing:

$scope.edit.today = null;

to

$scope.add.today = null;

Or initialise it, if you are missing it with $scope.edit = {};

Given your edited code, you have a working solution

var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
  $scope.today = new Date();
  $scope.add = {};

  if ($scope.today) {
    var today = new Date($scope.today)
    $scope.add.today =
      today.getFullYear() + '-' + (today.getMonth() + 1) + '-' + today.getDate();
  } else {
    $scope.add.today = null;
  }
});

<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">

<body>
  <div ng-app="myApp" ng-controller="myCtrl">

    <div class="form-group col-sm-4">
      <label for="Date">Date</label>
      <input type="date" class="form-control" name="add_row_today" id="add_row_today" ng-model="today">
    </div>

  </div>
</body>
</html>

edited Jun 6, 2018 at 15:04

answered Jun 6, 2018 at 14:57

Aleksey Solovey

4,1663 gold badges18 silver badges34 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Celestialchippy Over a year ago

yeah sorry there is an option to add the day and edit the day I accidentally posted the edit option

Collectives™ on Stack Overflow

AngularJS date in controller undefined

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related