Remove week column and button from Angular-ui bootstrap datepicker

Question

I am using angular-ui bootstrap datepicker. Now I need to remove #(week) column and week button from datepicker. This date picker is being used in many forms of my application.

Answer 1

For datepicker in popup, datepicker-options attribute has value dateOptions in which json can be added for any datepicker settings as shown in the HTML below.

<input type="text" class="form-control" datepicker-popup="{{format}}" ng-model="dt" is-open="opened" min-date="minDate" max-date="'2015-06-22'" **datepicker-options="dateOptions"** date-disabled="disabled(date, mode)" ng-required="true" close-text="Close" />

In javascript this is given

 $scope.dateOptions = {
    formatYear: 'yy',
    startingDay: 1,

  };

just add showWeeks:false in dateOptions like this,

 $scope.dateOptions = {
    formatYear: 'yy',
    startingDay: 1,
    showWeeks:'false'
  };

or you can add like this 'show-weeks':'false' . Demo is shown at plunker [http://plnkr.co/edit/qbp3IObj13op2RS17IEg?p=preview][1]

Answer 2

If angular bootstrap ui version is 0.14.3, use the following

app.config(function (uibDatepickerConfig) {
    uibDatepickerConfig.showWeeks = false;
    uibDatepickerConfig.showButtonBar = false;
});

Answer 3

To hide the weeks number you can use two different way.

First one: adding into controller

$scope.dateOptions = {
    'year-format': "'yy'",
    'starting-day': 1   };

or Second way: add attribute in input field

show-weeks="'false'"

Answer 4

Please, look at this example: http://plnkr.co/edit/6i4G7JkvBiWXZYlrV2GL?p=preview

angular.module('app', ['ui.bootstrap'])
  .config(function (datepickerConfig) {
      datepickerConfig.showWeeks = false;
    });

Answer 5

If you want to do it directly in the template, simply add the following attribute to the input:show-weeks="false".