时间戳

首页 > 解决方案 > EditorFor只能输入时间，不能设置24小时格式

asp.net-mvc - EditorFor只能输入时间，不能设置24小时格式

问题描述

我正在尝试不同的东西，比如不同的 DataFormatString 甚至不同的控件来使它使用 24 格式，但它保持 AM/PM 格式，如何使其成为 24hs 格式？

编辑： 经过更多搜索，我意识到这个相同的代码向某些人显示 24 小时格式，所以我可以重新表述为：什么可以在我的 PC 中配置为 AM/PM？我已经将 web.config 中的语言环境更改为 24 小时语言环境，但结果是一样的。我的区域设置也是24小时制。

看法：

<div class="col-md-2">
    Horario teórico Desde
    @Html.EditorFor(model => model.HorarioTeoricoDesde, new { htmlAttributes = new { @class = "form-control form-control-sm" } })
    @Html.ValidationMessageFor(model => model.HorarioTeoricoDesde, "", new { @class = "text-danger" })
</div>

视图模型：

[Display(Name = "Horario Teorico Desde")]
[Required(ErrorMessage = "El Horario Teorico Desde es Requerido")]
[DataType(DataType.Time)]
[DisplayFormat(ApplyFormatInEditMode = true, DataFormatString = "{0:HH:mm}")]
public DateTime? HorarioTeoricoDesde { get; set; }

我的区域设置是 24 小时，西班牙语。这是我的 web.config：

  <system.web>
    <globalization culture="es-AR" uiCulture="es-AR" />

这就是我的看法：

这就是我的看法：

谢谢！！

标签： asp.net-mvctwitter-bootstrapbootstrap-4

解决方案

当您使用DataType.Time输入时，类型为time.

输入类型time是 HTML5 中的新内容。这种类型的支持仍然很差。即使您看到 HH:MM AM/PM 格式的时间（24 版本（目前正在开发中）），在后端它仍然以 24 小时格式工作，您可以尝试使用一些基本的 javascript 来查看。

示例：使用bootstrap-timepicker。

视图模型：- 

public class Time24ViewModel
{
    [DataType(DataType.Time)]
    [DisplayFormat(ApplyFormatInEditMode = true, DataFormatString = "{0:HH:mm}")]
    public DateTime? HorarioTeoricoDesde { get; set; }

    [Display(Name = "Horario Teorico Desde")]
    [Required(ErrorMessage = "El Horario Teorico Desde es Requerido")]
    public string HorarioTeoricoDesdeStr
    {
        get
        {
            return HorarioTeoricoDesde.HasValue ? HorarioTeoricoDesde.Value.ToString("HH:mm") : "";
        }
        set
        {
            if (!string.IsNullOrWhiteSpace(value))
            {
                var time = TimeSpan.Parse(value);
                HorarioTeoricoDesde = new DateTime(time.Ticks);

            }
        }
    }
}

控制器：-

public class TimeController : Controller
{
    // GET: Time
    public ActionResult Time24()
    {
        var model = new Time24ViewModel
        {
            HorarioTeoricoDesde = DateTime.Now
        };
        return View(model);
    }
    [HttpPost]
    public ActionResult Time24(Time24ViewModel model)
    {
        if (!ModelState.IsValid)
        {
            return View(model);
        }
        return View(model);
    }
}

看法：-

<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-timepicker/0.5.2/js/bootstrap-timepicker.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-timepicker/0.5.2/css/bootstrap-timepicker.css" rel="stylesheet" />

@using (Html.BeginForm("Time24", "Time", FormMethod.Post)) { 
<div class="col-md-2">
    Horario teórico Desde
    @Html.EditorFor(model => model.HorarioTeoricoDesdeStr, new { htmlAttributes = new { @class = "form-control form-control-sm" } })
    @Html.ValidationMessageFor(model => model.HorarioTeoricoDesdeStr, "", new { @class = "text-danger" })
</div>
<div class="col-md-2">
    <input type="submit" class="btn btn-dark" value="Submit"/>
</div>
}

<script>
    $('#HorarioTeoricoDesdeStr').timepicker({
        showMeridian: false
    });
</script>

（经测试）

推荐阅读