3

好的，我正在使用 SASS 运行 FOundation 5 我在这里下载了 Peter Beno 的 Datepicker：

https://github.com/najlepsiwebdesigner/foundation-datepicker

现在我知道它说它是为 Foundation 4 制作的，但我看不出它为什么不能在 Foundation 5 中工作。是的，javascript 有点过头了，但这就是我使用别人的日期选择器的原因.

以下是我在 Foundation 5 中实现这个日期选择器的步骤。

1）我将其重命名foundation-datepicker.js为foundation.datepicker.js 并将其包含在JS 包中。我的页面现在正在加载这个脚本。

2)重命名foundation-datepicker.css_datepicker.scss并将其包含在sass 文件夹中。它现在被吸入我缩小的 css 文件中，我检查了。

然后我在我的页面上使用了这个代码：

    @Html.TextBoxFor(model => model.StartedDate, new { type = "text", id = "dp1", @class = "span2" })

从 asp.net mvc 输出到这个：

    <input class="span2" id="dp1" name="StartedDate" type="text" value="1/1/1981 12:00:00 AM" />

我也在调用 jQueryui 之后添加了这个

    <script type="text/javascript">
    $('.datepicker').fdatepicker()
    </script>

这是文档页面，如果他可以帮助我在 Foundation 5 中进行这项工作，我会对其进行更新并使他更加清楚。

http://foundation-datepicker.peterbeno.com/example/example.html

我在 Mozilla 中对其进行了测试，以避免 Chromes 糟糕的日期选择器。我究竟做错了什么。它最有可能与 Foundation 5 冲突吗？是否有另一个我可以使用的日期选择器有点类似，它是基于 jQueryUI 的，并不糟糕。

4

2 回答 2

2

我已经尝试过 Peter 的 UI 实现，但我也遇到了麻烦，所以我为 Foundation 构建了自己的日期和时间选择界面。它有点新鲜，但我的公司一直在生产现场使用它并且它正在坚持。

https://github.com/jockmac22/foundation_calendar_date_time_picker

我围绕不显眼的 javascript 构建了它，因此它很容易通过输入字段中的数据属性来实现。

我有一个 SCSS 文件，您可以将其包含在您的基础 SASS 构建中，以将所需的 CSS 直接合并到您的最终 CSS 文件中。通过这种方式，您可以使用现有的基础设置自定义颜色，并在 SASS 框架内轻松进行任何其他更改。

它支持自定义日期、时间和字段值格式，因此您可以使用 ISO 标准（或任何其他格式）作为存储在字段中的最终值，以用户友好的方式显示日期和时间。我使用 Ruby strftime 格式化选项作为日期格式的基础。

如果您决定尝试，请告诉我您的想法。

于 2014-01-22T07:13:18.000 回答
0

在您的回答中，您调用 fdatepicker：

<script type="text/javascript">
$('.datepicker').fdatepicker()
</script>

但是生成的 HTML 中缺少类.datepicker

<input class="span2" id="dp1" name="StartedDate" type="text" value="1/1/1981 12:00:00 AM" />

这不是问题吗？如果您在空元素集上调用 fdatepicker，您将看不到任何输出。如果 UI 有问题，请在 datepicker Github repo 上打开一个带有描述/屏幕截图的问题。 https://github.com/najlepsiwebdesigner/foundation-datepicker

谢谢！

编辑：Foundation datepicker 现在完全支持 F5，我们仍然在发布标签下提供 F4 版本。

于 2014-10-01T14:32:59.500 回答