I've inherited some code utilising the bootstrap framework.

I'm currently seeing some odd behaviour where no matter what date was last picked, the date picker always seems to open showing the month of July. Is there any particular places in the code I should be looking to see if anything funny is happening? Nothing looks out of the ordinary to me and I cannot see a method call setting it's value within the show() event.

Cheers

Mike

Dani AI

Generated

Quick summary: tracked this down to a format-token mismatch in the picker’s parsing code; the parser didn’t recognise the month token used in the supplied format, so it silently fell back to a default and the widget always opened on the same month. This is a common symptom when the format string in HTML/data attributes or options does not match the tokens the datepicker expects.

Checklist and practical fixes:

  • Verify the exact format token set used by the datepicker implementation and make sure your data- attribute and JS format option match it (token case can be significant).
  • Confirm where the format is coming from (inline option, data-date-format, or code) and that no later code overrides it.
  • After initialization, check the parsed value with the widget API (for example, use the picker’s getDate or equivalent) and test isNaN(parsed.getTime()) to detect parse failures.
  • If parsing can fail, explicitly set a fallback using the picker API (setDate or update) so the initial view is correct.
  • Remember native JavaScript Date months are zero-based (January is 0).

Example guard (unique from the original posts):

var $dp = $('#myDate');
var parsed = $dp.datepicker('getDate');

if (!parsed || isNaN(parsed.getTime())) {
  // fallback to a known date (months are 0-based)
  $dp.datepicker('setDate', new Date(2010, 0, 1));
  $dp.datepicker('update');
}

Also heed 's nudge about default settings when debugging: check defaults first, then work outward to custom code.

Recommended Answers

All 3 Replies

Nothing in the default settings? Hard to say without seeing it.

Just been digging. Traced it down to the constructor.

this.format = DPGlobal.parseFormat(options.format||this.element.data('date-format')||'mm/dd/yyyy');

and then

this.date = DPGlobal.parseDate(typeof newDate === 'string' ? newDate : (this.isInput ? this.element.prop('value') : this.element.data('date')), this.format);

where

typeof newDate === 'string' ? newDate : (this.isInput ? this.element.prop('value') : this.element.data('date'))

returns "01/01/2010" and then

this.date = DPGlobal.parseDate(typeof newDate === 'string' ? newDate : (this.isInput ? this.element.prop('value') : this.element.data('date')), this.format);

returns "Thu Jul 1 00:00:00 UTC+0100 2010".

I'm presuming something is off in the formatting?

Edit: woo 1k posts xD

Resolved.

Within the DPGlobal.parseDate method it was looking for a format of mm whereas the format was MM so was defaulting to the current month. :)

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.