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 回答