i am not able to bind the date-picker with ng-model

Question

I am trying to save the value of selected date to db. But the ng-modal is not reflecting the selected date from the datepicker. Also none of the validation is working in this.

 var app = angular.module('app', []); app.controller('myController', function($scope){ $scope.valid = false; var today=new Date(); $scope.today = today.toISOString(); $scope.submit = function(){ $scope.valid = true; } $scope.close = function(){ $scope.valid = false; } addFlood =function(){ alert(JSON.stringify(addFlood)); } });

 //here is the html file for the datepicker <!-- here is my html file --> <!DOCTYPE html> <html lang="en" ng-app="app"> <head> <meta charset="utf-8"> <title>AngularJS Form Validation</title> <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"> <script data-require="angular.js@1.6.2" data-semver="1.6.2" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.2/angular.js"></script> <script type="text/javascript" src="https://code.jquery.com/jquery-1.11.3.min.js"></script> <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.4.1/js/bootstrap-datepicker.min.js"></script> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.4.1/css/bootstrap-datepicker3.css"/> <style type="text/css"> .errortext { color: red; } </style> </head> <body ng-controller="myController"> <div class="container-fluid"> <div class="row col-md-6 col-sm-6 col-xs-12"> <div class=" form-body"> <form role="form" name="myForm" novalidate> <div class="form-group"> <label class="control-label "> Gate Open Date - Today:-> {{today | date:'yyyy-MM-dd'}} </label> <div class="input-group date" date-picker> <!-- <input class="form-control" id="date" name="date" placeholder="MM/DD/YYYY" type="date"/>--> <input type="text" id="date" name="gateOpenDate" class="form-control" placeholder="YYYY-MM-DD" [(ngModel)]="$parent.addFlood.gateOpenDate" min="{{today | date:'yyyy-MM-dd'}}" required autofocus date-picker-input/> <div class="errortext" ng-show="myForm.gateOpenDate.$dirty && myForm.gateOpenDate.$invalid"> <span ng-show="myForm.gateOpenDate.$error.required">Gate Open Date is required</span> <span ng-show="myForm.gateOpenDate.$error.date">Date Format Must Be MM-DD-YYYY</span> <span ng-show="myForm.gateOpenDate.$error.min">Gate open Date should not be less than current date</span> </div> <div class="input-group-addon"> <i class="fa fa-calendar"> </i> </div> </div> </div> </form> </div> </div> </div> ngModel :{{addFlood.gateOpenDate}} <script src="angular.js"></script> <script> $(document).ready(function() { var date_input = $('input[name="gateOpenDate"]'); //our date input has the name "date" var container = $('.bootstrap-iso form').length > 0 ? $('.bootstrap-iso form').parent() : "body"; date_input.datepicker({ format: 'yyyy-mm-dd', container: container, todayHighlight: true, autoclose: true, startDate: new Date(), }) }) function read() { var value = element.find('input').val(); ngModel.$setViewValue(value); } </script> </body> </html>

Answer 1

ng-model $ - The date object. Must be a Javascript Date object. You may use the uibDateParser service to assist in string-to-object conversion.

i am not able to bind the date-picker with ng-model

Question

1 answers

solution1
0 2019-01-17 12:06:28

i am not able to bind the date-picker with ng-model

Question

1 answers

solution1 0 2019-01-17 12:06:28

solution1
0 2019-01-17 12:06:28