Bootstrap Timepicker in Angularjs -
i new angularjs. have following directive bootstrap timepicker.
directive('timepicker', function(){ return { restrict: 'ac', link: function(scope, el, attr) { if( ! jquery.isfunction(jquery.fn.timepicker)) return false; var $this = angular.element(el), opts = { template: attrdefault($this, 'template', false), showseconds: attrdefault($this, 'showseconds', false), defaulttime: attrdefault($this, 'defaulttime', 'current'), showmeridian: attrdefault($this, 'showmeridian', true), minutestep: attrdefault($this, 'minutestep', 15), secondstep: attrdefault($this, 'secondstep', 15) }, $n = $this.next(), $p = $this.prev(); $this.timepicker(opts); if($n.is('.input-group-addon') && $n.has('a')) { $n.on('click', function(ev) { ev.preventdefault(); $this.timepicker('showwidget'); }); } if($p.is('.input-group-addon') && $p.has('a')) { $p.on('click', function(ev) { ev.preventdefault(); $this.timepicker('showwidget'); }); } } } }).
in partial html view, have following code,
<input type="text" id="start_time" class="form-control timepicker" placeholder="shift time" name="start_time" data-default-time="data.emp_start_time" ng-model="data.emp_start_time" id="end_time" data-template="dropdown" data-minute-step="5"> <input type="text" class="form-control timepicker" placeholder="shift time" name="end_time" data-default-time="data.emp_end_time" ng-model="data.emp_end_time" data-template="dropdown" data-show-meridian="true" data-minute-step="5" >
Comments
Post a Comment