用户没有任何输入字段时出现 Blazor 验证错误

Question

我正在开发一个预订应用程序，并且有一个日历，其中的日期布置为按钮，因此当用户单击所需的入住或退房日期时，它会自动填充我的模型。

我的问题是，当我没有任何

InputText

字段供用户填写时，我将如何抛出自己的验证错误？

// This iterated through the remaining days in the month to properly display the calendar
@for (int i = DateTime.Now.AddDays(1).Day; i <= daysInMonth; i++)
{
    DateTime date = new DateTime(calendarMonth.Year, calendarMonth.Month, i);

    <div class="active">
        <button @onclick="() => SetDate(DateOnly.FromDateTime(date))">@i</button>
    </div>
}

<EditForm Model="@booking" OnValidSubmit="CreateDates" FormName="CommitDates">
    <div class="contact-form-button span-all">
        <button type="submit" class="btn btn-main">Submit<i class="fa-solid fa-paper-plane btn-icon"></i></button>
    </div>

    <div class="span-all">
        <DataAnnotationsValidator />
        <ValidationSummary />
    </div>
</EditForm>

@code {
    [Parameter]
    public int daysInMonth { get; set; }

// status parameter just checks whether we are modifying the check in or check out date value
    [Parameter]
    public bool status { get; set; }

    [Parameter]
    public DateOnly calendarMonth { get; set; }

    [Parameter]
    public BookingDatesVM booking { get; set; }

    protected override Task OnInitializedAsync()
    {
        return base.OnInitializedAsync();
    }

    private void SetDate(DateOnly date)
    {
        if (status)
        {
            booking.CheckInDate = date;
        }
        else
        {
            booking.CheckOutDate = date;
        }
    }

    private async Task CreateDates()
    {
        //await _bookingRepository.Create(booking);
    }
}

这是我的模型，会话 ID 使用

ProtectedSessionStorage

存储，并从父组件中检索并传递到该子组件中。

public class BookingDatesVM
{
    [Required]
    public Guid SessionId { get; set; }

    [Required]
    public DateOnly CheckInDate { get; set; }

    [Required]
    public DateOnly CheckOutDate { get; set; }

    public Status BookingStatus { get; set; }
    public DateTime CreatedDate { get; set; }

    public enum Status
    {
        InProcess,
        Pending,
        New,
        Approved,
        Declined,
        Cancelled
    }
}

我尝试研究这个问题并尝试了一些我在这里看到的

EditContext

材料，但仍然没有给我任何有关错误的输出。 我还尝试添加文本框并用值填充它们，但这也不起作用。

Answer 1

基于您的代码的示例：

@for (int i = DateTime.Now.AddDays(1).Day; i <= daysInMonth; i++)
{
    DateTime date = new DateTime(calendarMonth.Year, calendarMonth.Month, i);

    <div class="active">
        <button @onclick="() => SetDate(DateOnly.FromDateTime(date))">@i</button>
    </div>
}


<EditForm EditContext="editContext" OnValidSubmit="CreateDates" FormName="CommitDates">
     <div class="span-all">
        <DataAnnotationsValidator />
        <ValidationSummary />
    </div>
    
    <div class="contact-form-button span-all">
        <button type="submit" class="btn btn-main">Submit<i class="fa-solid fa-paper-plane btn-icon"></i></button>
    </div>

    
</EditForm>

@code {
    [Parameter]
    public int daysInMonth { get; set; } = DateTime.DaysInMonth(DateTime.Now.Year, DateTime.Now.Month);

    // status parameter just checks whether we are modifying the check in or check out date value
    [Parameter]
    public bool status { get; set; }

    [Parameter]
    public DateOnly calendarMonth { get; set; }

    [Parameter]
    public BookingDatesVM booking { get; set; }
    

    private EditContext? editContext;

    private ValidationMessageStore? messageStore;

    protected override Task OnInitializedAsync()
    {
        booking = new();
        editContext = new(booking);
        editContext.OnValidationRequested += HandleValidationRequested;
        messageStore = new(editContext);
        return base.OnInitializedAsync();
    }

    public void Dispose()
    {
        if (editContext is not null)
        {
            editContext.OnValidationRequested -= HandleValidationRequested;
        }
    }

    private void SetDate(DateOnly date)
    {
        if (status)
        {
            booking.CheckInDate = date;
        }
        else
        {
            booking.CheckOutDate = date;
        }
    }

    private async Task CreateDates()
    {
        //await _bookingRepository.Create(booking);
    }

    private void HandleValidationRequested(object? sender,
        ValidationRequestedEventArgs args)
    {
        messageStore?.Clear();

        // Your validation logic
        if (booking.CheckOutDate.DayNumber > DateTime.Now.Day+5)
        {
            messageStore?.Add(()=>booking.CheckOutDate, "Your  Error");
        }
    }

}

结果：