WayBehind
WayBehind

Reputation: 1697

Display Day of the Week after Date with bootstrap-datepicker

I'm using bootstrap-datepicker and would like to also display the actual day of the week in the text field right after the date.

Example: 12/01/2014 Monday

my datepicker configuration

$(document).ready(function () {

            $('#calendar').datepicker({
                format: "mm/dd/yyyy",
                weekStart: 1,
                autoclose: true,
                todayHighlight: true,
            });              
        });

The actual datepicker source is here:

https://bootstrap-datepicker.readthedocs.org/

Upvotes: 1

Views: 10963

Answers (3)

Paramjeet
Paramjeet

Reputation: 316

Just change one thing

format: "mm/dd/yyyy DD"

http://bootstrap-datepicker.readthedocs.io/en/latest/options.html#format

Upvotes: 8

user5170568
user5170568

Reputation: 11

The following Code worked :

$('#CalenderInputTextBox').change(function (e) {                

   var eventDate = $('#CalenderInputTextBox').val();

   var weekday = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];

   var date = new Date(eventDate).getDay();

   var day = weekday[date];               

  $('#CalenderInputTextBox').val($('#CalenderInputTextBox').val() + ' ' + day);

  });

Upvotes: 1

JuanSedano
JuanSedano

Reputation: 1025

You can try something like this, only add this part to your code:

$('#calendar').change(function () { //Your date picker input
    var eventDate = $('#calendar').val();
    var dateElement = eventDate.split("/");
    var dateFormat = dateElement[2]+'-'+dateElement[0]+'-'+dateElement[1];
    var date = new Date(dateFormat+'T10:00:00Z'); //To avoid timezone issues
    var weekday = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];
    var day = weekday[date.getDay()];
    $('#calendar').val($('#calendar').val() + ' ' + day);
}); 

Hope works for you.

Upvotes: 4

Related Questions