I haven't found a way to use the date popup picker to enter dates for profile date fields. If this isn't possible, I'd like this feature to be added. If it is possible, how do I enable it?

Files: 
CommentFileSizeAuthor
#2 date_pic.png277.12 KBmohammadjolani

Comments

I don't believe this is possible, at least not through the Date module. This module is meant to be used as a CCK field, and doesn't add it's functionality to other modules. (Also, the Profile module stores the date information differently than the way the Date module stores dates)

Having said that, if you really want a date pop up, you might look into Content Profile, which creates profiles as content (nodes), where you can use things like CCK to give your users better input widgets. That would probably be the fastest route for you.

If that doesn't suit your needs, if you can write javascript, you could:

  • alter the edit and registration forms on the fly: hide the profile date drop down, and create an generic text field and attach the jQuery UI date picker to it
  • when the date is selected, change the hidden drop down fields accordingly:the jQuery UI datepicker has an event that fires once a date is selected; attach a function to that, and then parse the values from the picker and change the dropdowns

This could probably also be achieved by writing a custom module, which is probably what should be done. Or wait for Drupal 7. ;P

Issue tags:+date, +Drupal 6, +profile, +date picker, +profile filed date picker
StatusFileSize
new277.12 KB

Hello Here is the solution :

In your Style sheet Customize this :

#datepicker {
    background: none repeat scroll 0 0 transparent;
    border: medium none;
    color: transparent;
    font-size: 0;
    line-height: 0;
    margin-right: -23px;
    width: 24px !important;
}
#edit-profile-birth-date-wrapper img {
    height: 17px;
    width: 17px;
}

In Your form alter for "user_register" form id add the following lines

<?php
jquery_ui_add
('ui.datepicker');
drupal_add_js('
        $("document").ready(function(){
        $("#edit-profile-birth-date-wrapper .container-inline").append(\' <input type="text" id="datepicker" /> \')
//        $("#datepicker").hide();
// edit-profile-birth-date-year
// edit-profile-birth-date-month
// edit-profile-birth-date-day
        $("#datepicker").datepicker({
          showOn: "button",
          buttonImage: "http://jqueryui.com/resources/demos/datepicker/images/calendar.gif",
          buttonImageOnly: true,
          onSelect : function(dateText, inst) {
            var date = dateText.split("/");
            day = parseInt(date[1],10);
            month = parseInt(date[0],10);
            year = parseInt(date[2]);
            $("#edit-profile-birth-date-year option").each(function(){
              if($(this).val() == year){
                $(this).attr("selected", "selected");
              }
            });
            $("#edit-profile-birth-date-month option").each(function(){
              if($(this).val() == month){
                $(this).attr("selected", "selected");
              }
            });
            $("#edit-profile-birth-date-day option").each(function(){
              if($(this).val() == day){
                $(this).attr("selected", "selected");
              }
            });
          },
        });
      });
      '
,'inline');
?>