How to reset EditForm after its been submitted?

Question

I have an EditForm that I would like to reset after the save button is clicked. I input data into the textboxes (InputText) on the EditForm. Each textboxes is binded to an object field so that a new object can be saved to my SQL Database.

<EditForm Model=@newSystem OnValidSubmit="HandleSubmit" >
    <DataAnnotationsValidator/>

    <label for="systemName">System Name:</label>
    <InputText id="systemName"  @bind-Value="@newSystem.SystemName" ></InputText>
    <ValidationMessage For="@(() => newSystem.SystemName)" />

    <label for="systemDescription">System Description:</label>
    <InputText id="systemDescription"  @bind-Value="@newSystem.SystemDescription"></InputText>
    <ValidationMessage For="@(() => newSystem.SystemDescription)" />

    <label for="systemAccessDetails">System Access Details:</label>
    <InputText id="systemAccessDetails"  @bind-Value="@newSystem.SystemAccessDetails"></InputText>
    <ValidationMessage For="@(() => newSystem.SystemAccessDetails)" />

    <label for="additionalInformation">Additional Information:</label>
    <InputText id="additionalInformation" @bind-Value="@newSystem.AdditionalInformation"></InputText>
    <ValidationMessage For="@(() => newSystem.AdditionalInformation)" />

    <label for="systemManagerName">System Manager Name:</label>
    <InputText id="systemManagerName"  @bind-Value="@newSystem.SystemManagerName"></InputText>
    <ValidationMessage For="@(() => newSystem.SystemManagerName)" />

    <label for="systemManagerEmailAddress">System Manager Email Address:</label>
    <InputText id="systemManagerEmailAddress"  @bind-Value="@newSystem.SystemManagerEmailAddress"></InputText>
    <ValidationMessage For="@(() => newSystem.SystemManagerEmailAddress)" />

    <label for="systemManagerContactNumber">System Manager Contact Number:</label>
    <InputText id="systemManagerContactNumber"  @bind-Value="@newSystem.SystemManagerContactNumber"></InputText>
    <ValidationMessage For="@(() => newSystem.SystemManagerContactNumber)" />

    <input type="checkbox" @bind="checkboxValue" /> Is this system retired?

    <div class="form-group" style="display:@(checkboxValue ? "block" : "none")">
        <label for="retiredDate">When did this system retire?</label>
        <input type="date" @bind="retiredDate"  />
    </div>

    <button type="submit" class="btn-primary">Add</button>

</EditForm>




@code {

    private bool checkboxValue;
    private DateTime retiredDate = DateTime.Now;

    SystemDatum newSystem = new SystemDatum();


    public void HandleSubmit(EditContext editContext)
    {
        
        var newSystem = (SystemDatum)editContext.Model;

        newSystem.DateAdded = DateTime.Now;

        if (checkboxValue == true)
        {
            newSystem.DateRetired = retiredDate;
        }
        else
        {
            newSystem.DateRetired = null;
        }
     
        systemService.AddSystem(newSystem);
      
    }

  

}

How can I reset each textbox back to null? I'm using blazor-server-side c# and EF.

Answer 1

<EditForm Model="_userRegisterDto" OnValidSubmit="Register">
<DataAnnotationsValidator/>
<ValidationSummary/>
<div class="form-group row">
    <label for="email" class="col-md-2 col-form-label">Email:</label>
    <div class="col-md-5">
        <InputText id="email" class="form-control" @bind-Value="_userRegisterDto.Email"></InputText>
    </div>
</div>

<div class="form-group row">
    <label for="password" class="col-md-2 col-form-label">Password:</label>
    <div class="col-md-5">
        <InputText id="password" class="form-control" @bind-Value="_userRegisterDto.Password"></InputText>
    </div>
</div>

<div class="form-group row">
    <label for="confirm" class="col-md-2 col-form-label">Confirm Password:</label>
    <div class="col-md-5">
        <InputText id="confirm" class="form-control" @bind-Value="_userRegisterDto.ConfirmPassword"></InputText>
    </div>
</div>

<div class="row">
    <div class="col-md-12 text-right">
        <button type="submit" class="btn btn-success">Register</button>
    </div>
</div>
</EditForm>






public class RegistrationBaseClass : ComponentBase
{
   
    [Inject]
    public IRegisterService _registerService { get; set; }
   
    protected UserRegisterDto _userRegisterDto = new UserRegisterDto();

    public bool IsSuccessResult { get; set; } = false;
    
    public string IsSuccessfulRegResult{ get; set; }
    public IEnumerable<string> ErrorMsg { get; set; }


    public async Task Register()
    {
        var result = await _registerService.RegisterUser(_userRegisterDto);

        if(!result.IsSuccessfulRegistration)
        {
             ErrorMsg = result.Errors;
                        
        }
        else
        {
            
            IsSuccessResult = true;
           IsSuccessfulRegResult = result.IsSuccessfulRegistrationResult;

            _userRegisterDto = new UserRegisterDto(); // Resets the form 
          
        }
    }

}