主页 / coding / 问题 / 79183301
Accepted
Mark Bonafe
Asked: 2024-11-13 11:04:48 +0800 CST

Blazor InputDate 控件在绑定日期为空时显示问题

  • 772

标记如下：

<InputDate @bind-Value="@EndTime" Type="InputDateType.DateTimeLocal" bind-Value:format="@DateTimeFormat" style="width:250px" />

DateTimeFormat = “dd/MM/yyyy HH:mm”。

当控件在页面上显示且 EndTime 为空时，它会显示“mm/dd/yyyy --:-- --”作为占位符。我希望在绑定值为空时控件为空。我该如何实现？控件上没有占位符属性。

在此处输入图片描述

另一个令人讨厌的问题是，尽管格式要求 24 小时制，但还是使用了“AM/PM”。

asp.net-core

1 个回答

  1. Best Answer

    这是默认行为<input type="date"/>，您需要覆盖输入的内置 css，这很难实现。
    您可以尝试一种解决方法，使其在值为空时透明。

    <style>
    .null-date {
        width: 250px;
        color: transparent; 
    }
    .non-null-date {
        width: 250px;
        color: black; 
    }   
</style>


<InputDate id="input3" @bind-Value="@EndTime" Type="InputDateType.DateTimeLocal" class="@((EndTime!=null)||(Focus) ?"non-null-date":"null-date")" @onfocus="()=>{Focus=true;}" @onfocusout="()=>{Focus=false;}" />

@code{
    private DateTime? EndTime { get; set; } = null;

    private bool Focus = false;
}
    • 0

相关问题