angularjs - Angular-UI multiple datepickers insider form controller -
i creating form multiple angular-ui datepickers , input data. datepickers have created controller , parent form controller sample given below. form controller has model includes datepicker dates.
js:
var app = angular.module('app', ['ui.bootstrap']); app.controller('datecntrl', function($scope,$timeout){ $scope.open = function() { $timeout(function() { $scope.opened = true; }); }; }); app.controller('formcntrl', function($scope, $http){ $scope.model = {name:'', startdate:'', enddate:''}; }); html:
<form ng-controller="formcntrl"> <input type="text" id="name" placeholder="name" ng-model="model.name" /> <div ng-controller="datecntrl"> <input datepicker-popup="dd-mmmm-yyyy" ng-model="model.startdate" id="startdate" type="text" /> <button class="btn" ng-click="open()"><i class="icon-calendar"></i></button> </div> <div ng-controller="datecntrl"> <input datepicker-popup="dd-mmmm-yyyy" ng-model="model.enddate" id="enddate" type="text" /> <button class="btn" ng-click="open()"><i class="icon-calendar"></i></button> </div> </form> - am going right way in having separate controller datepicker. act common controller date inputs
- if yes, possible have generic way of binding data in datepicker controller model dates(model.startdate,model.enddate in case) in parent controller.
- is there alternative way go this.
thanks , regards.
should have read more scope inheritance
the parent scope values can accessed using $parent
<form ng-controller="formcntrl"> <input type="text" id="name" placeholder="name" ng-model="model.name" /> <div ng-controller="datecntrl"> <input datepicker-popup="dd-mmmm-yyyy" ng-model="$parent.model.startdate" id="startdate" type="text" /> <button class="btn" ng-click="open()"><i class="icon-calendar"></i></button> </div> <div ng-controller="datecntrl"> <input datepicker-popup="dd-mmmm-yyyy" ng-model="$parent.model.enddate" id="enddate" type="text" /> <button class="btn" ng-click="open()"><i class="icon-calendar"></i></button> </div> </form>
Comments
Post a Comment