Patch #19468: Replace jQuery UI Datepicker with native browser date fields when available - Redmine

Actions

Copy link

Patch #19468

closed

Replace jQuery UI Datepicker with native browser date fields when available

Added by Jan from Planio www.plan.io about 9 years ago. Updated over 7 years ago.

Status:

Closed

Priority:

Normal

Assignee:

Jean-Philippe Lang

Category:

Target version:

3.3.0

Start date:

Due date:

% Done:

Estimated time:

Description

Some browsers have started to implement the input type "date" and are rendering nice native date pickers.

Here's a patch that uses Rails' date_field instead of text_field. To still support browsers which are not implementing date fields, the jQuery UI Datepickers are still rendered when date fields are not available.

This is especially useful on mobile devices where the jQuery UI Datepickers do not seem to work well, at least not in combination with #19097 it seems.

Here's a nice list of browsers that support this feature: http://caniuse.com/#feat=input-datetime and here's a screenshot of what it looks like on Chrome for OS X:

Files

Download all files

native_datepicker.png (59.6 KB) native_datepicker.png		Jan from Planio www.plan.io, 2015-03-24 17:31
0001-Use-HTML5-date-input-fields-instead-of-text-fields-w.patch (10.2 KB) 0001-Use-HTML5-date-input-fields-instead-of-text-fields-w.patch		Jan from Planio www.plan.io, 2015-03-25 16:28
19468-for-r15361.diff (9.17 KB) 19468-for-r15361.diff		Go MAEDA, 2016-05-01 03:08

Related issues

Actions

Copy link

Updated by Jan from Planio www.plan.io about 9 years ago

Related to Feature #19097: Responsive layout for mobile devices added

Actions

Copy link

Updated by Jan from Planio www.plan.io about 9 years ago

File 0001-Use-HTML5-date-input-fields-instead-of-text-fields-w.patch 0001-Use-HTML5-date-input-fields-instead-of-text-fields-w.patch added

Revising the patch in order to also change date fields in issue queries/filters

Actions

Copy link

Updated by Jan from Planio www.plan.io about 9 years ago

File deleted (~~0001-Use-HTML5-date-input-fields-instead-of-text-fields-w.patch~~)

Actions

Copy link

Updated by Go MAEDA about 9 years ago

I have tried the patch with Chrome (Mac).

It looks neat but ignores 'Start calendars on' setting.

Actions

Copy link

Updated by Go MAEDA about 9 years ago

Has duplicate Feature #13509: Better mobile support: input with date added

Actions

Copy link

Updated by Jan from Planio www.plan.io about 9 years ago

Go MAEDA wrote:

It looks neat but ignores 'Start calendars on' setting.

Yes, the same goes for the language. Since it's a browser widget, it follows the settings defined in the Operating System, not in Redmine. The HTML5 tag does not support supplying a "start calendar on" setting. So this is a limitation we would have to live with.

Redmine's "Start calendars on" setting is still useful for e.g. the Calendar view in projects, so we should keep it in any case.

Actions

Copy link

Updated by Go MAEDA almost 8 years ago

File 19468-for-r15361.diff 19468-for-r15361.diff added
Status changed from Needs feedback to New
Target version set to 3.3.0

I slightly modified Jan's patch for the latest trunk(r15361).

Although it ignores 'Start calendars on' setting, I think this is not a problem because it respects the settings defined in the operating system as Jan said.

Jan from Planio www.plan.io wrote:

This is especially useful on mobile devices where the jQuery UI Datepickers do not seem to work well, at least not in combination with #19097 it seems.

Absolutely. Redmine supports responsive layouts since 3.2.0. I suggest including this feature in Redmine 3.3.0.

Actions

Copy link

Updated by Jean-Philippe Lang almost 8 years ago

Category set to UI
Status changed from New to Closed
Assignee set to Jean-Philippe Lang

Committed, thanks.

Actions

Copy link

Updated by Toshi MARUYAMA almost 8 years ago

Jan from Planio www.plan.io wrote:

Go MAEDA wrote:

It looks neat but ignores 'Start calendars on' setting.

Yes, the same goes for the language. Since it's a browser widget, it follows the settings defined in the Operating System, not in Redmine. The HTML5 tag does not support supplying a "start calendar on" setting. So this is a limitation we would have to live with.

Redmine's "Start calendars on" setting is still useful for e.g. the Calendar view in projects, so we should keep it in any case.

Ref: #23224.

Actions

Copy link

#10

Updated by Luc Luc over 7 years ago

Native date picker breaks Redmine Settings, see #23224.

Thanks,
Luc

Actions

Copy link

#11

Updated by Toshi MARUYAMA over 7 years ago

Related to Feature #23892: Switch date pickers embedded in browsers or bundled in redmine added

Actions

Copy link

#12

Updated by Kush Suryavanshi over 7 years ago

Sorry, if this a stupid question - but, if we apply this patch, will we be able to use the "time" functionality that's mentioned in #5458? It seems that we need to use JQuery input for #5458 but this patch will give preference to native pickers. Thanks for the help.

Actions

Copy link

#13

Updated by Jan from Planio www.plan.io over 7 years ago

Kush Suryavanshi wrote:

Sorry, if this a stupid question - but, if we apply this patch, will we be able to use the "time" functionality that's mentioned in #5458? It seems that we need to use JQuery input for #5458 but this patch will give preference to native pickers. Thanks for the help.

#5458 has not been committed to Redmine yet. There are native time pickers as well using <input type="time"> which can be used for #5458 if implemented.

Actions

Copy link

#14