datepicker 相关问题

datepicker是许多框架中的用户界面元素,允许用户通常通过可视日历选择日期,在某些情况下还可以选择时间。

Wordpress 联系表格 7 日期选择器更改日期格式

我正在 WordPress 中使用 Contact Form 7 插件,我想在我的日期选择器中获得一些帮助,了解如何更改表单前端的显示日期格式。 默认显示 mm/dd/yy,我想要

回答 5 投票 0

限制日期选择器颤动中选定日期的范围

我正在构建预订应用程序,目前我面临这个问题,用户可以使用 ShowDateRangePicker、showDateRangePicker 选择日期范围,但是用户可以选择任何范围...

回答 2 投票 0

点击日期时是否可以关闭 DatePicker 的日历?

我有一个基本的 SwiftUI 日期选择器,点击时会显示日历小部件: 日期选择器( “日期”, 选择:$日期, 在:...日期(), 显示组件:[.date] ) 当您选择...

回答 7 投票 0

如何在material-ui Date Picker的日历UI中按降序显示年份

我使用的示例代码 - 导入“./styles.css”; 从“@mui/x-date-pickers”导入{DatePicker}; 从“@mui/x-date-pickers/LocalizationProvider...

回答 1 投票 0

当我单击搜索按钮时,Angular Material Datepicker 在 Angular 9 中显示晚了一天

html: html: <mat-form-field> <input matInput [matDatepicker]="picker1" placeholder="From date: mm/dd/yyyy" name="from_date" [(ngModel)]="callListRequestOb.from_date" maxlength="150"> <mat-datepicker-toggle matSuffix [for]="picker1"></mat-datepicker-toggle> <mat-datepicker #picker1></mat-datepicker> </mat-form-field> 方法中: this.callListRequestOb.from_date = new Date(this.callListRequestOb.from_date).toISOString().slice(0, 10); 当我在日期选择器中选择日期时,它会选择正确的日期。但是当我单击搜索按钮(我不包括它)时,选择时间显示落后日期。我正在开发 Angular 9。我该如何解决这个问题? 您从日期选择器中选择的日期是当地时间。 从 toISOString() 的文档可以清楚地看出这是 UTC 时间。 “时区始终为零 UTC 偏移,如后缀“Z”所示。” https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/toISOString 如果当地时间最初是当天晚上的 00:00:00,这种差异可能会导致完全不同的一天。 通过减去时区偏移,您可以解决这个问题。 const d = new Date(this.callListRequestOb.from_date) // This will return an ISO string matching your local time. new Date(d.getFullYear(), d.getMonth(), d.getDate(), d.getHours(), d.getMinutes() - d.getTimezoneOffset()).toISOString(); 我用“字符串连接”轻松解决了这个问题。 在.component.html中 <!-- date of birth --> <mat-form-field> <input matInput readonly [matDatepicker]="picker" placeholder="Date of birth" formControlName="dob" (dateChange)="formatDate($event)"> <mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle> <mat-datepicker #picker></mat-datepicker> <mat-error *ngIf="handleError('dob', 'required')">Date of birth is required</mat-error> </mat-form-field> 在.component.ts中 /* format date */ formatDate(e: any) { var d = new Date(e.target.value) var convertDate = d.toISOString().substring(0, 10) + d.toISOString().substring(10,); this.actorForm.get('dob')?.setValue(convertDate, { onlyself: true }); } 这可能是时区问题, 在发布数据时,我在 mat-datepicker 和有效负载中选择了日期 14,它显示注册日期:“2023-02-13T16:30:00.000Z” 所以,我刚刚创建了函数 setDate(date:Date){ let d=date; d.setHours(d.getHours() + 5); d.setMinutes(d.getMinutes() + 30); return new Date(d) } 现在,一切正常,因为比下一个日期晚了 5:30。我刚刚添加了 5:30 小时。 这是一个时区问题。如果您控制台并查看日期选择器记录的时间,您将看到对于任何选定的日期,它默认为午夜 (00:00:00)。对于 UTC 以东的时区,此方法效果很好,因为它只需要添加几个小时来解决时差,而无需更改日期。但是,在 UTC 以西的时区中,减去小时数来调整时差会无意中将日期移动一天。看下面的函数,它有一个条件来处理“关闭一天”问题。您可以调用此函数,以便它在日期选择器的值发生变化时运行。 const d = new Date(); const dateFieldSetter = () => { const adjustedTime = (d) => { if (d) { if (d?.getTimezoneOffset() < 0) { d?.setMinutes(d?.getMinutes() - d.getTimezoneOffset()); } } return d?.toISOString()?.split('T')?.[0]; }; };

回答 4 投票 0

如何禁用材料日期范围选择器中的日期范围?

这里我有一个使用 Material 库的 DateRangePicker。 val 日期范围选择器 = MaterialDatePicker.Builder.dateRangePicker() .setTitleText(getString(R.string.

回答 1 投票 0

com.ycuwq.widgets/datepicker 在 Maven 存储库中不可用

https://mvnrepository.com/artifact/com.ycuwq.widgets/datepicker 说 1.3.1 在 jcenter 中可用。 但 jcenter 在 https://jcenter.bintray.com/ 上不可用。如何找到可以...的存储库

回答 1 投票 0

MUI 静态日期选择器 sx 属性不起作用

我需要禁用 mui datepicker 中的默认对话操作按钮,但 sx 道具不起作用 这是我用于日期选择器组件的代码: 我需要禁用 mui datepicker 中的默认对话操作按钮,但 sx 道具不起作用 这里是我用于日期选择器组件的代码: <LocalizationProvider dateAdapter={AdapterDayjs}> <StaticDatePicker sx={{ ".MuiDialogActions-root": { display: "none", backgroundColor: "red !important", }, }} showToolbar={false} value={selectedDate} views={["month", "year"]} onChange={handleDateChange} toolbarFormat={false} pickersToolbar={false} /> </LocalizationProvider>; 如果您想删除按钮但背景为红色,则通过 display: 'none' 您无法查看包含该行的 MuiDialogActions 按钮根。 您可以尝试这样的操作,现在将隐藏各个按钮,但将背景显示为红色 <LocalizationProvider dateAdapter={AdapterDayjs}> <StaticDatePicker sx={{ '.MuiDialogActions-root': { backgroundColor: 'red !important' }, '.MuiButtonBase-root': { display: 'none', backgroundColor: 'red !important' }, }} showToolbar={false} views={['month', 'year']} toolbarFormat={false} pickersToolbar={false} /> </LocalizationProvider> 沙盒

回答 1 投票 0

Material3 DatePicker 中的月份导航按钮颜色

我无法更改 jetpack 撰写 DatePicker 中月份导航按钮的颜色: 尝试修改主题颜色并设法更改除按钮之外的所有内容的颜色。

回答 1 投票 0

日期选择器引导5

我已经从 bootstrap4 切换到 bootstrap5,并且我正在努力使用日期选择器。如果有人做过这方面的工作,请帮忙。 我也添加了日期选择器插件,但仍然不起作用......

回答 5 投票 0

Angular Macial DateInput Harness 返回格式错误的值

我有显示 Angular Material 日期输入的组件。我正在尝试使用 Material Harness CDK 和 Spectator 来测试它。我的日期格式有问题。 我有自定义日期适配器: 出口CL...

回答 1 投票 0

自定义 Tempus Dominus 6 日期/时间选择器以使用特定颜色标记特殊日子

我正在使用 Tempus Dominus 版本 6,并对 Tempus Dominus datepicker JS 控件进行以下配置: 从“@hotwired/stimulus”导入{控制器} 导入 { TempusDominus }

回答 1 投票 0

MUI Datepicker onChange 事件适用于手动输入,但不适用于单击日期

我已经尝试了一段时间但无济于事。 当用户在文本字段中手动输入日期时, onChange 事件会触发,一切都会按我想要的方式进行。当用户点击...

回答 2 投票 0

.NET MAUI Picker:阻止用户文本输入

我在 .NET MAUI 中遇到 Pickers 和 DatePickers 问题。我使用选择器来显示可供用户选择的选项,这些选项是我从 API 获取的。但是,如果我使用键盘输入文本,...

回答 1 投票 0

MUI MonthPicker 导致 Storybook 中出现 LocalizationProvider 错误

我正在使用MUI MonthPicker(MUI v5.x),它在代码中工作正常,但是当我在故事书中使用该组件时,它给了我以下错误: MUI:在上下文中找不到实用程序。看起来像...

回答 1 投票 0

将 Day.js 与 Material-UI DatePicker 结合使用时,如何解决 TypeScript 错误“类型‘Dayjs’缺少类型‘日期’的属性”?

我正在尝试在我的 React 项目中将 Day.js 与 Material-UI 的 DatePicker 组件一起使用。但是,当我将 minDate 和 maxDate 属性设置为 Day.js 对象时,我收到 TypeScript 错误: 输入“Dayjs...

回答 2 投票 0

如何将@react-native-community/datetimepicker与React Hook Form一起使用?

我尝试制作一个日期选择器,当单击带有图标的字段和字符串格式的当前日期时会出现该日期选择器。 我使用 React Native、React Hook Form 和 @react-native-community/datetimepicker....

回答 1 投票 0

jQuery 日期选择器动态设置所选日期

如何动态更改 jquery 日期选择器的选定日期? 我说过创建了一个内联日期选择器。 然后过了一段时间,我想在那里反映一个不同的日期,而不需要重复...

回答 15 投票 0

如何清除 Antd 表单中的 Datepicker 值?

如果触发按钮位于具有 Datepicker 的同一 Form.Item 内,则它可以工作,但如果按钮位于 datepicker 外部则无法清除。 我基本上尝试在提交后清除日期选择器。 很奇怪,我无法理解...

回答 2 投票 0

使用 Angular 指令禁用材质输入文本选择

我想使用 Angular Directive 禁用文本选择。到目前为止,我发现像下面这样的角度解决方案对我不起作用(从未调用处理程序 onSelectStart)。 导入 { 指令,

回答 1 投票 0

© www.soinside.com 2019 - 2024. All rights reserved.