Question

我正在使用from this link中的DateTime选择器来获取用户的日期和时间。我在使用bootstrap。这是我的代码：

        <div id="startDateTimePicker" class="input-append date">
            Data e Hora Inícial do Gráfico
            <input id="plotStartDate" name="StartDate" data-format="dd/MM/yyyy hh:mm:ss" value="startDateTime" type="text" />
            <span class="add-on">
                <i data-time-icon="icon-time" data-date-icon="icon-calendar"></i>
            </span>
        </div>

        <div id="endDateTimePicker" class="input-append date">
            Data e Hora Final do Gráfico
            <input id="plotEndDate" name="EndDate" data-format="dd/MM/yyyy hh:mm:ss" type="text" />
            <span class="add-on">
                <i data-time-icon="icon-time" data-date-icon="icon-calendar"></i>
            </span>
        </div>

        <script type="text/javascript">
            $(function () {

                $('#startDateTimePicker').datetimepicker({
                    language: 'pt-BR'
                });

                $('#endDateTimePicker').datetimepicker({
                    language: 'pt-BR'
                });

                $("#endDateTimePicker").data('datetimepicker').setLocalDate(now);
                $("#startDateTimePicker").data('datetimepicker').setLocalDate(oneHourAgo);
            });
        </script>

运行系统时不显示图标日期和图标时间。我不知道在哪里找到那些。

有人可以帮我在屏幕上显示这些图标吗？

这个插件选择日期和时间有更好的选择吗？我发现只有几个日期或时间的实现，但两者都没有。

感谢。

Answer 1

看起来您正在使用Bootstrap 2.3.2 icons。按照以下步骤在项目中设置Bootstrap 2.3.2：http://getbootstrap.com/2.3.2/getting-started.html

我想向您推荐3.0版本的Bootstrap。在3.0中，图标使用情况发生了一些变化：http://getbootstrap.com/components/#glyphicons

版本2.3.2：

<i class="icon-date"></i>

3.0版：

<span class="glyphicon glyphicon-date"></span>

Answer 2

查看此示例以解决您的问题。

打开BundleConfig.cs并修改样式包“〜/ Content / themes / base / css”，如下所示：

bundles.Add（new StyleBundle（“〜/ Content / themes / base / css”）。包括（ “〜/ Content / themes / base / jquery-ui.css”，“〜/ Content / themes / base / jquery-ui.all.css”））;

打开_layout.cs并在

@ Scripts.Render（ “〜/捆绑/ jquery的”） @ Scripts.Render（ “〜/捆绑/ jQueryUI的”） @ Styles.Render（ “〜/内容/主题/碱/ CSS”） @RenderSection（“scripts”，required：false）

最后要测试您的视图，请打开index.cshtml并在最后添加

日期：

@section Scripts{
    @*@Scripts.Render("~/bundles/jqueryval")*@
    <script type="text/javascript">
        $(document).ready(function () {
            $(".datefield").datepicker();
        });
    </script>
}

如果仍有任何疑问，请与我们联系。

干杯

MVC4 DateTimePicker找不到图标时间和图标日历

2 个答案: