(function() {
'use strict';

angular
    .module('app.inspection')
    .controller('mainCtrl', mainCtrl)
    .controller('scheduleModalCtrl', scheduleModalCtrl);

mainCtrl.$inject = ['$scope', '$state', '$modal'];

function mainCtrl($scope, $state, $modal) {

 $scope.schedule_modal = function() {
   var modalView = $modal.open({
   templateUrl:'schedule_modal.html',
   backdrop: 'static',
   controller: 'scheduleModalCtrl',
   windowClass: 'modal-dialog-schedule'
 });
}

scheduleModalCtrl.$inject = ['$scope', '$modalInstance'];
function scheduleModalCtrl($scope, $modalInstance) {
 $('#date').datetimepicker({
  format: 'DD/MM/YYYY'
 });
}
})();

<div class="col-xs-12 col-sm-12 col-md-12">
 <label for="insp-date" class="label-style">Date</label>
 <div class='input-group date' id='date'>
  <input type='text' class="input-style" placeholder="dd/mm/yyyy"/>
  <span class="input-group-addon">
   <span class="glyphicon glyphicon-calendar"></span>
  </span>
 </div>
</div>

.state('app.main', {
 url: '/manageinspection',
 title: 'Manage Inspection Page',
 controller: 'mainCtrl',
 templateUrl:   helper.basepath('pages/main/main.html'),
 resolve: helper.resolveFor('bootstrap','moment','bootstrapDateTimePicker')
})