问题标签 [flatpickr]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
1401 浏览

javascript - 如何从 flatpickr 中的选定日期最好地访问一天属性?

我的任务是让用户选择一个日期(在输入框中正常显示)。创建了一个包含年份的新变量,但如果需要,使用提供的日期中的一些逻辑来更改它。

我不知道我是否打算只使用提供的 .selectedDates 日期数组,或者 flatpickr 是否可以以包含日期作为单独属性的格式返回日期?

(逻辑是如果你出生在 1 月 1 日和 2 月 3 日之间,你会落入上一个日历年,这是针对亚洲精神系统的)

到目前为止,我有这个:

我似乎无法使用 flatpickr 方法或对象属性将 Day 作为变量?没有日属性,但有年和月。

我可以使用fp.currentYear,但没有currentDay。解决办法是什么?谢谢!

0 投票
1 回答
700 浏览

javascript - 结合禁用和启用日期 - 不起作用

我正在使用flatpickr日历。它支持启用/禁用日期的各种功能,但我似乎无法同时启用和禁用。

我正在尝试禁用星期日,并禁用将来的所有日期(从我使用 PHP 生成的日期开始计算)。

在我添加第二个功能以仅启用过去的日期之前,禁用星期日确实有效,包括。今天。

这是代码:

认为这可能是因为功能的顺序,我交换了它们(disable是第一,enable是第二),但是当我打开日历时,前一个星期日仍然有效。

希望你能帮忙。

0 投票
1 回答
8579 浏览

date - Flatpickr 日历显示错误的默认日期

我在 wordpress 中安装了 facetwp,搜索完成后,搜索小部件未显示搜索前选择的正确日期

如何通过 javascript 覆盖此显示问题(选定日期)?

要查看此问题的实际操作:https ://www.sweetpictures.com.my/product-category/photographers/?fwp_photo=2018-01-31%2C2018-01-31%2C1&fwp_productcategory=ampang&fwp_expertise=wedding-reception

假设日历选择器选择的日期是 2018 年 1 月 31 日,但它显示的是 2018 年 8 月 20 日

亲切的帮助和帮助表示赞赏

0 投票
1 回答
4632 浏览

javascript - 如何在 Flatpickr 中获得选定的完整日期?

我可以得到所选日期的年份和日期,但我不能得到月份?

我想在我选择的日期得到这个日期。

我想得到这样的格式“2018-01-27”

当我使用date.getMonth()它返回 0

如何获得像这种格式“2018-01-27”这样的选定完整日期

0 投票
1 回答
578 浏览

angular - Flatpickr - 更改角度 2 的 dateFormat

我正在尝试理解他的文档,但无法完全弄清楚如何将日期格式从数字更改为字母。例如,我试图获得 2018 年 4 月 1 日。

我不知道是否需要在 html 或我的 component.ts 文件中执行此操作。

如果我需要在我的 component.ts 文件中执行此操作,我正在寻找有关如何执行此操作的示例。这方面的文档没有那么有用。

非常感谢帮助

0 投票
1 回答
1947 浏览

javascript - Flatpickr 用所选日期填充 div 文本

当您输入 时,我的.auto-input函数会填充容器 div ,但是当您选择日期时,它不会获取字段中的值并填充div 文本。.textinputflatpickr input.flatpickr

如何.flatpickr根据来自的输入来填充其中的文本#flapickr

0 投票
1 回答
258 浏览

javascript - 异步显示 flatpickr 中的占用情况,而不用请求淹没服务器

我正在尝试通过flatpickr构建一个日历,该日历显示月视图中的占用情况。这个日期选择器中的小点:

在此处输入图像描述

flatpickr 的文档说明了一种与日单元交互的相当简单的方法,并在创建日单元时添加一些元素或操作单元:

非常酷:每次创建单元格时都会调用此回调,因此每次视图 30|31 次。

占用率通过一个 API 公开,该 API 采用单个或一组日期,并返回一个包含占用信息的数组:

onDayCreate-event 中,我可以调用 API 并根据返回的结果采取行动。虽然这会创建 30/31 请求,但它是可行的,但效率不高。

到现在为止还挺好; 但问题在于,如果您滚动浏览月份,每个月都会向 API 生成 30/31 的请求。即使月份只显示了几分之一秒。本质上我是在 DDOSsing 我自己的服务器。

我的下一个方法是在 1 个请求中预加载“第一”月,并使用onDayCreate-event 从预加载的数组中挑选。

随后几个月的占用情况将在onMonthChange-event 中异步加载。但是,flatpickr 似乎触发了onMonthChange-event 并继续进行白天创建:

在此处输入图像描述
红线上方:初始月份;下面我点击下个月。

所以我不能在onMonthChange中使用新加载的数据...

关于如何将占用信息动态加载到 flatpickr 而不用(不必要的)请求重载 API 的任何帮助

0 投票
1 回答
1332 浏览

jquery - 单击时初始化 Flatpickr

我目前调用 flatpickr 如下:

但是,我需要在初始化之前将日期时间数据发送到该字段。我尝试了以下方法:

它设置了日期,但是它不使用我设置的任何设置。

0 投票
1 回答
2383 浏览

jquery - 通过编程设置 Flatpickr defaultDate

我通过 html 组件使用来自 Wix Code 的 Flatpickr。使用 postMessage/onMessage 的通信非常有效。我可以将选择的日期从 datepicker(html 组件)发送回 Wix。另外,我可以从 Wix 发送到组件。问题是我 postMessage 一个有效的日期,它完美地到达,但是我需要将它设置为 flatpickr defaultDate 属性。而且,我无法解决。线

或者

不设置默认日期。event.data持有一个有效的日期来设置。

这是一个语法问题,我知道,但我无法弄清楚。

下面的代码:

0 投票
1 回答
380 浏览

javascript - 动态表单字段添加清除所有字段的输入

我创建了一个可以动态添加和删除字段的表单。我非常接近让它工作,但由于某种原因,我可以填写第一个字段,添加一个新字段,第一个字段数据仍然存在。然后当我添加第二个字段时,填写并添加另一个,它将清除所有现有数据。

我可以说flatpickr日历总是在第一个字段上,但是当我添加后续字段时,flatpickr日历仅适用于最后一个字段,实际上不会显示两者之间的任何字段。我真的需要一些帮助,因为我花了这么长时间试图弄清楚:(

我相信这是我的 JS 以及它如何获取最后一个元素的问题,而不是它如何调用flatpickr库。

这是我在 JSFiddle 中的所有代码: https ://jsfiddle.net/danboy4/w9s9ayep/

谢谢!