Remove numbers before month in dropdown, it makes user confused when drowdown is not opened

[nilamacharya]

Bug: Remove numbers before month in dropdown, it makes user confused when drowdown is not opened

1. Navigate to Header from left Rail
2. Select "Header Media"
3. Make anu changes
4. Select "setting" icon near "publish" button from top
5. Select "Schedule" radio button
6. Check Date Field

[birgire]

@nilamacharya Welcome to WordPress trac

I must admit that this has confused me too, as e.g. 01-jan looks like "1st of January" to me.

It seems to be generated within get_month_choices(), introduced in version 4.9:

$months[ $i ]['text']  = sprintf( __( '%1$s-%2$s' ), $i, $month_text );

https://core.trac.wordpress.org/browser/tags/4.9/src/wp-includes/customize/class-wp-customize-date-time-control.php#L194

On my test install it shows as a 1-jan format, compared to the 01-jan format when editing post dates. That's because only the latter is zeroised with: $monthnum = zeroise($i, 2);. At least these two should be using the same format (like jan, 1-jan or 01-jan) for the sake of constistency.

I checked the post date editing, and it's generated within the touch_time() function:

$month .= sprintf( __( '%1$s-%2$s' ), $monthnum, $monthtext ) . "</option>\n";

https://core.trac.wordpress.org/browser/tags/4.9/src/wp-admin/includes/template.php#L726

This 01-jan format was introduced in version 3.3, where @jane writes:

For those people who have trouble converting numerical dates to text month names, let's amend the date picker month dropdown to include the month number as well, credit card form style.

See ticket #18838 and changeset [18860].

[zalak151291]

$month_text = $wp_locale->get_month_abbrev( $wp_locale->get_month( $i ) );
$months[ $i ]['text']  = sprintf($month_text);
$months[ $i ]['value'] = $i;

[zalu1512]

Hi,

I have resoled month dropdown problem and please let me know if any other changes.

Thanks.

[zalu1512]

resolved dropdown issue

[karmatosed]

I can see how this could help for scanning and also accessibility. Are there any examples of how other sites do this we can lean on?

[mdwolinski]

Per our discussion in #design, here are some current examples of Date input from across a couple of sites.

Facebook, Google and Gutenberg all allow entry and selection from calendar popover. Apple ID is typing in the date (which would have to account for the different ways people read dates, ie Month/Day/Year or Day/Month/Year).

Apple iOS (sorry, don't have an Android device) shows just the full month name without the month number.

I suspect, the current design is for type entries, ie tab to the field and hit 2 to bring up February.

Personally, I'd follow Gutenberg's design pattern.

[mdwolinski]

Different Date Selection design patterns

[Rarst]

Related, but seemingly more broad, ticket #46366

[ibdz]

In ​design triage today, we agreed to follow the Gutenberg's design pattern - DateTime component. (​https://developer.wordpress.org/block-editor/components/date-time/)