- click "Add" : to add a new data
- click "Submit" : it will show "Required"
- click "Delete" : to delete the data
- click "Submit" : can't submit ?
The below is my code, you can copy the code and creat a razor page to try it.
Thank you!
test.razor
@page "/mytest"
@using Radzen
@using Radzen.Blazor
<RadzenTemplateForm Data="@EditingData" TItem="RequestDto" Submit="@Form0Submit" >
<table border="1" class="col-md-12">
<tbody>
@{
int index1 = 0;
string validatorItemName = "";
}
@foreach (PurchaseDto Ele in EditingData.Purchases)
{
index1 += 1;
validatorItemName = "aaa" + index1.ToString();
<tr>
<td>
<RadzenTextBox @bind-Value="Ele.Item" Name="@validatorItemName" />
<RadzenRequiredValidator Component="@validatorItemName" Text="Required" Popup="@ValidatorResult" />
</td>
<td>
<RadzenButton Text="Delete" Click="() => deleteClick(Ele)" />
</td>
</tr>
}
</tbody>
<tfoot>
<tr>
<td>
<RadzenButton Click="@((args) => newClick(args))" Text="Add" />
</td>
</tr>
</tfoot>
</table>
<RadzenButton ButtonType="ButtonType.Submit" Text="Submit"></RadzenButton>
</RadzenTemplateForm>
@code{
public partial class PurchaseDto
{
public string Item{ get; set;}
}
public partial class RequestDto
{
public List<PurchaseDto> Purchases { get; set; } = new List<PurchaseDto>();
}
private RequestDto EditingData { get; set; } = new RequestDto();
private bool ValidatorResult;
private void newClick(MouseEventArgs arg)
{
EditingData.Purchases.Add(new PurchaseDto());
}
public void deleteClick(PurchaseDto ele)
{
EditingData.Purchases.Remove(ele);
StateHasChanged();
}
protected async System.Threading.Tasks.Task Form0Submit(RequestDto args)
{
}
}