Как я могу вызвать метод проверки EditForm из другого метода? - PullRequest
Новая
       62

Как я могу вызвать метод проверки EditForm из другого метода?

0 голосов
/ 29 января 2020

То, что я хотел бы создать:

Я бы создал страницу сервера Blazor, содержащую данные. Некоторые из этих данных доступны только для чтения, поэтому пользователь может только видеть их. Другие данные могут быть изменены пользователем, поэтому он будет изменять их с помощью EditForm.

Я бы не вставлял кнопку отправки внутри EditForm, вместо этого я хотел бы создать панель кнопок который содержит несколько кнопок, которые пользователь может нажать. Одним из них будет кнопка Сохранить все . Когда пользователь нажимает на нее, эта кнопка должна вызвать функцию EditForm validate () , чтобы проверить, действительны ли данные, содержащиеся в EditForm, или нет.

Возможно ли это? 

<button @onclick="Foo">click me</button>

<EditForm Model="@_exampleModel" OnValidSubmit="HandleValidSubmit">
    <DataAnnotationsValidator />
    <ValidationSummary />

    <InputText id="name" @bind-Value="_exampleModel.Name" />
</EditForm>

@code {
    private ExampleModel _exampleModel = new ExampleModel();

    private void HandleValidSubmit()
    {
        Console.WriteLine("OnValidSubmit");
    }

    private void Foo() 
    {
        //how can I call EditForm validate method?
    }
}

Ответы [ 2 ]

2 голосов
/ 29 января 2020

Вы можете установить EditContext вашего EditForm следующим образом: 

<button @onclick="Foo">click me</button>

<EditForm EditContext="_editContext" OnValidSubmit="HandleValidSubmit">
    <DataAnnotationsValidator />
    <ValidationSummary />

    <InputText id="name" @bind-Value="_exampleModel.Name" />
</EditForm>

@code {
    private ExampleModel _exempleModel = new ExampleModel();
    private EditContext _editContext;

    protected override OnInitialized()
    {
        _editContext = new EditContext(_exempleModel);
        base.OnInitialized();
    }

    private void HandleValidSubmit()
    {
        Console.WriteLine("OnValidSubmit");
    }

    private void Foo() 
    {
        //how can I call EditForm validate method?
        if (_editContext.Validate())
        {            
            // TODO: Add the code to persist your model
        }
    }
}
1 голос
/ 29 января 2020

Это рабочий пример, скопируйте и вставьте его в компонент страницы индекса и запустите его. Вы также должны определить этот класс модели:

Comment.cs 

public class Comment
    {
        [Required]
        [MaxLength(10)]
        public string Name { get; set; }

        [Required]
        public string Text { get; set; }
    }

Обратите внимание:

  • Для проверки вашей модели у вас есть для вызова метода EditContext.Validate

  • Кнопка «Сохранить» изначально отключена ...

  • Код также подписывается на событие OnFieldChanged объекта EditContext, метод, который проверяет достоверность модели. Этот метод вызывается всякий раз, когда поле изменилось.

  • Когда вы выходите из второго поля и модель действительна, кнопка Сохранить активируется.

  • Результат выводится в окне вывода

надеюсь, это поможет ...

Замените код в Index.razor на код ниже ... 

<h1>My articles</h1>

<p>Leave me a comment</p>

<EditForm EditContext="@EditContext">
    <DataAnnotationsValidator />

    <div class="form-group">
    <label for="name">Name: </label>
    <InputText Id="name" Class="form-control" @bind-Value="@Model.Name"> 
    </InputText>
    <ValidationMessage For="@(() => Model.Name)" />
     </div>
    <div class="form-group">
    <label for="body">Text: </label>
    <InputTextArea Id="body" Class="form-control" @bind-Value="@Model.Text"> 
     </InputTextArea>
    <ValidationMessage For="@(() => Model.Text)" />
</div>

</EditForm>
<p>
    <button>Action 1</button>
    <button>Action 2</button>
    <button disabled="@Disabled" @onclick="Save">Save</button>
</p>

 @code
 {
     private EditContext EditContext;
     private Comment Model = new Comment();

     protected string Disabled { get; set; } = "disabled";

     private async Task Save ()
    {
        await Task.Delay(3000);
        Console.WriteLine("Saving...");
        Console.WriteLine(Model.Name);
        Console.WriteLine(Model.Text);
    }

    protected override void OnInitialized()
   {
       EditContext = new EditContext(Model);
       EditContext.OnFieldChanged += EditContext_OnFieldChanged;

       base.OnInitialized();
   }

   protected override void OnAfterRender(bool firstRender)
   {
       base.OnAfterRender(firstRender);

       SetSaveDisabledStatus();
   }

private void EditContext_OnFieldChanged(object sender, FieldChangedEventArgs 
                                                                          e)
{
    SetSaveDisabledStatus();
}

private void SetSaveDisabledStatus()
{
    if (EditContext.Validate())
    {
        Disabled = null;
    }
    else
    {
        Disabled = "disabled";
    }
}
}
...