如何在 MVC 4 中设置时间选择器

Question

我需要创建一个仅包含时间字段的视图。 任何人都可以帮助我了解如何在 MVC 4 razor 中创建Timepicker 。

这是我的代码：

型号

public TimeSpan TIME_OUT { get; set; }

查看

<div class="form-group">
     @Html.LabelFor(model => model.TIME_OUT, "End Time", htmlAttributes: new { @class = "col-xs-4 col-sm-offset-1 col-sm-4" })
     <div class='input-group date col-xs-8 col-sm-6' id='timeout'>
          @Html.TextBoxFor(model => model.TIME_OUT, new { @class = "form-control" })
          <span class="input-group-addon">
              <span class="glyphicon glyphicon-time">
              </span>
          </span>
     </div>
</div>

JavaScript：

$(function () {
    $('#timeout').datetimepicker({
        format: 'LT'
    });
 });

这是我的代码的结果：

但是当我点击时间图标时，它没有显示我想要的结果

这就是我想在我的时间选择器中做的事情

Answer 1

您可以使用引导程序时间选择器，并通过此 Jquery 进行设置

$("#YourId").timepicker("setTime", '');

请参阅此 Bootstrap Timpicker 示例，

https://eonasdan.github.io/bootstrap-datetimepicker/

响应式引导程序 3 时间选择器

http://tarruda.github.io/bootstrap-datetimepicker/