sp-dev-docs
sp-dev-docs copied to clipboard
Microsoft Lists: date picker shown on the upper-left corner of UI when inlineEditField JSON property is applied to a date column
Target SharePoint environment
SharePoint Online
What SharePoint development model, framework, SDK or API is this about?
not applicable
Developer environment
None
What browser(s) / client(s) have you tested
- [ ] 💥 Internet Explorer
- [X] 💥 Microsoft Edge
- [X] 💥 Google Chrome
- [ ] 💥 FireFox
- [ ] 💥 Safari
- [ ] mobile (iOS/iPadOS)
- [ ] mobile (Android)
- [ ] not applicable
- [ ] other (enter in the "Additional environment details" area below)
Additional environment details
- Microsoft Edge Version 126.0.2592.102 (Official build) (64-bit)
- Google Chrome Version 126.0.6478.127 (Official build) (64-bit)
Describe the bug / error
When "inlineEditField" JSON property is applied to a DateTime column, the related date picker appears on the upper-left corner of Microsoft Lists user interface:
Furthermore, the placeholder letters related to week days are displayed based on a wrong language. For example, here is what's happening with italian UI:
Just for curiosity, I had a look at what's going on behind the scenes and here is the result in my browser DOM:
This bug has been confirmed by @tecchan1107 too.
Steps to reproduce
- Create a new list
- Add a date-time column named "Start" (just as an example)
- Click on Column setting --> Click on Format this column --> Click on Advanced mode
- Apply the following basic JSON code and save:
{ "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/column-formatting.schema.json", "elmType": "div", "inlineEditField": "[$Start]", "style": { "box-sizing": "border-box", "padding": "0 2px", "overflow": "hidden", "text-overflow": "ellipsis" }, "attributes": { "class": "sp-field-fontSizeMedium sp-css-color-BlackText sp-field-bold" }, "txtContent": "[$Start.displayValue]" }
Expected behavior
When clicking on a cell to trigger the inlineEditField property, the date picker should appear positioned exactly over its underlying cell.