CODEWITHSUNDEEP
angularjsangular-ui-bootstrap
vsraju
vsraju

Reputation: 93

How to select a week with date picker

I'm using angular bootstrap datepicker. i have only one datepicker and need to select week(sunday to saturday) not day of week

for ex,

  1. Select Week period from popup calender .

  2. Select week period 19 July, 2015 to 25 July, 2015

  3. Here comes output as 07/19/2015 To 07/25/2015

in jQuery, i know how to do it, jQuery weekpicker . I am curious how to select week using AngularJS

I would be grateful for any assistance.

Thanks.

Upvotes: 3

Views: 9219

Answers (2)

vsraju
vsraju

Reputation: 93

Thanks Afroza Yasmin :-)

Finally, i got it

Please see the source How the select week with pick viewer

    angular.module('app', ['ui.bootstrap']).controller("BodyCtrl", function($scope) { $scope.formData = {};  $scope.data = {};$scope.dateOptions = {
    formatYear: 'yy',
    startingDay: 0,
    showWeeks:'false'};$scope.$watch('formData.dueDate',function(dateVal){
        var weekYear = getWeekNumber(dateVal);
        var year = weekYear[0];
        var week = weekYear[1];

        if(angular.isDefined(week) && angular.isDefined(year)){
            var startDate = getStartDateOfWeek(week, year);
        }
        var weekPeriod = getStartDateOfWeek(week, year);
        if(weekPeriod[0] != 'NaN/NaN/NaN' && weekPeriod[1] != 'NaN/NaN/NaN'){
            $scope.formData.dueDate = weekPeriod[0] + " to "+ weekPeriod[1];
        }

    });

    function getStartDateOfWeek(w, y) {
        var simple = new Date(y, 0, 1 + (w - 1) * 7);
        var dow = simple.getDay();
        var ISOweekStart = simple;
        if (dow <= 4)
            ISOweekStart.setDate(simple.getDate() - simple.getDay());
        else
            ISOweekStart.setDate(simple.getDate() + 7 - simple.getDay());

        var ISOweekEnd = new Date(ISOweekStart);
        ISOweekEnd.setDate(ISOweekEnd.getDate() + 6);

        ISOweekStart = ISOweekStart.getDate()+'/'+(ISOweekStart.getMonth()+1)+'/'+ISOweekStart.getFullYear();
        ISOweekEnd = ISOweekEnd.getDate()+'/'+(ISOweekEnd.getMonth()+1)+'/'+ISOweekEnd.getFullYear();
        return [ISOweekStart, ISOweekEnd];
    }

    function getWeekNumber(d) {
        d = new Date(+d);
        d.setHours(0,0,0);
        d.setDate(d.getDate() + 4 - (d.getDay()||7));
        var yearStart = new Date(d.getFullYear(),0,1);
        var weekNo = Math.ceil(( ( (d - yearStart) / 86400000) + 1)/7);
        return [d.getFullYear(), weekNo];
    }
});

Thanks all

Upvotes: 1

Afroza Yasmin
Afroza Yasmin

Reputation: 511

Calculate week from date picker, you can try this one

 $('#date').datepicker({onSelect: function() {
        var mon = $(this).datepicker('getDate');
        mon.setDate(mon.getDate() + 1 - (mon.getDay() || 7));
        var sun = new Date(mon.getTime());
        sun.setDate(sun.getDate() + 6);
        alert(mon + ' ' + sun);
}});

See from this link - https://forum.jquery.com/topic/datepicker-select-week

Upvotes: 7

Related Questions