jquery - 使用JQuery-UI的MVC中的DateTimePicker

在我的mvc应用程序中，我需要一个datetimepicker。我从Here得到了一个代码。

所以首先我引用这些js和css文件。

    <script src="~/Scripts/jquery-1.9.0.min.js"></script>
        <script src="~/Scripts/jquery-ui.min.js"></script>
        <script src="~/Scripts/jquery-ui-timepicker-addon.js"></script>
<link href="~/Content/jquery-ui-timepicker-addon.css" rel="stylesheet" />

然后，

<div>
@Html.TextBox("fromdate", DateTime.Now.ToString("MM/dd/yyyy HH:mm"), new { @class = "from-date-picker", @readonly = "readonly" })
</div>

然后在脚本中

$('.from-date-picker').datetimepicker({
            dateFormat: 'mm/dd/yy',
            timeFormat: 'hh:mm',
            timeInput: true,
            stepHour: 1,
            stepMinute: 5
        });

所以我有一个像这样的日期时间选择器。



但是这里的时间是通过使用滑块进行选择的。我正在尝试使其类似于以下类型。



所以这样尝试。

$('.from-date-picker').datetimepicker({
    controlType: 'select',
    oneLine: true,
    timeFormat: 'hh:mm tt'
});

但是它仍然像旧样式一样来临。那是与滑子。如何更改为第二种类型？

最佳答案

我用example创建jsfiddle。

一切都像魅力。

我想您只是不添加一些js或CSS。这是我添加的内容:

<script type="text/javascript" src="//code.jquery.com/jquery-1.9.1.js"></script>
<script type="text/javascript" src="//code.jquery.com/ui/1.9.2/jquery-ui.js"></script>
<link rel="stylesheet" type="text/css" href="//code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css">
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery-ui-timepicker-addon/1.6.1/jquery-ui-sliderAccess.js"></script>
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-ui-timepicker-addon/1.6.1/jquery-ui-timepicker-addon.css">
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery-ui-timepicker-addon/1.6.1/jquery-ui-timepicker-addon.js"></script>

关于jquery - 使用JQuery-UI的MVC中的DateTimePicker，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/34804954/