7

I'm using an excellent jquery plugin for Birthday Date picking for my web form.

Demo here: http://abecoffman.com/stuff/birthdaypicker/

The problem I'm dealing with is on a form validation. My form validation redirect back to the same page and I'll lose the date that was picked.

Is there any way to add an option to the javascript of the date picker: http://abecoffman.com/stuff/birthdaypicker/bday-picker.js

so that I can set a "default selected date". The config can work to something like:

$("#picker1").birthdaypicker({
  chosenDay: 1;"
  chosenMonth: 28;"
  chosenYear: 2011;"
 });

This will set the "selected" date to January 28, 2011.

Abe
  • 161
  • 7
Yada
  • 30,349
  • 24
  • 103
  • 144
  • That plugin does not appear to support a selected date at initialization time. Perhaps you could modify it. – Pointy Jan 28 '11 at 16:46
  • My js skill is limited. I'm looking to see how I would go about modifying it. – Yada Jan 28 '11 at 16:48
  • I've [updated the plugin](http://abecoffman.com/stuff/birthdaypicker/) to allow setting a default date. – Abe Mar 22 '11 at 06:43

2 Answers2

3

Without modifying the plugin you could use JQuery to set the values. The markup that the plugin generates looks like this:

<fieldset class='birthday-picker'>
    <select class='birth-year' name='birth[year]'></select>
    <select class='birth-month' name='birth[month]'></select>
    <select class='birth-day' name='birth[day]'></select>
</fieldset>

So your JQuery would simply have to get a hold on those elements and set their value. You'd want to make sure you're setting a value that exists in the select list.

$('select.birth-year').val('my_year');      // 1980
$('select.birth-month').val('my_month');    // 1-12 (not "Jan" which is the text)
$('select.birth-day').val('my_day');        // 1-31 (keep month limitation in mind)

This code would have to be called after the plugin has been called, otherwise the markup won't have been generated yet.

Abe
  • 161
  • 7
0

If the server returns a date like this (c# code):

new DateTime(birthYear, birthMonth, birthDay, 0, 0, 0, DateTimeKind.Utc).ToString(CultureInfo.InvariantCulture);

On jquery-birthday-picker.min.js file you'll find a code like this:

if (s.defaultDate) {
            var d = new Date(s.defaultDate);
            console.log(d);
            u.val(d.getFullYear());
            a.val(d.getMonth() + 1);
            f.val(d.getDate())
        }

just change it for:

if (s.defaultDate) {
            var d = new Date(s.defaultDate);
            console.log(d);
            u.val(d.getFullYear());
            a.val(d.getMonth() + 1);
            f.val(d.getDate())

            //Added by LVC
            $birthday.val(s.defaultDate);
        }

Then, when you specify a defaultDate the control will work as as we want to

Lizzael Villar Cruz
  • 31
  • 5