When I assign an Id to a FormGroup in TelerikForm, it's value can be seen in code, but neither the attribute nor it's value get rendered.
When I updated to the latest version I noticed that the FormItems in AuthorizedViews were moved to the bottom of the form, Quick example:
<TelerikForm>
<FormItems>
<AuthorizeView>
<Authorized>
<FormItem Field="First"/>
</Authorized>
</AuthorizeView>
<FormItem Field="Second"/>
</FormItems>
</TelerikForm>will end up like
<TelerikForm>
<FormItems>
<FormItem Field="Second"/>
<FormItem Field="First"/>
</FormItems>
</TelerikForm>
My Nullable DateOnly field shows as 1/1/2001 - I would expect it to be a more sensible default. The problem is applicable only for the Form autogenerated DatePicker. The same issue is applicable for the TimeOnly type.
===ADMIN EDIT===
In the interim, as a viable workaround, you can utilize the FormItem Template and declare a TelerikDatePicker like this:
@using System.ComponentModel.DataAnnotations
<TelerikForm Model="@PersonModel">
<FormValidation>
<DataAnnotationsValidator></DataAnnotationsValidator>
</FormValidation>
<FormItems>
<FormItem>
<Template>
<label for="country">Date of Birth:</label>
<TelerikDatePicker @bind-Value="@PersonModel.DOB" Width="200px" />
</Template>
</FormItem>
</FormItems>
</TelerikForm>
@code {
private Person PersonModel { get; set; } = new Person() { DOB = null };
public class Person
{
[Display(Name = "Date of Birth")]
public DateOnly? DOB { get; set; }
}
}
https://docs.telerik.com/blazor-ui/components/form/formitems/formitemstemplate
Render defined Form items inside a FormItemsTemplate Example
Line 22 has @nameof(Person.Id) which generates an error, should be without the @ as shown below.
<TelerikFormItemRenderer Item="@( formItems.First(x => x.Field == nameof(Person.Id)) )" />
I have a rather large TelerikForm that contains multiple TelerikTabStrip controls that contain FormItems. In the new version 4.1.0 the form items in the tabstrip do not display correctly and the form items not in the tabs are moved to the bottom of the page. The markup in a test project i created shows the tabstrip above and outside the form tag. Works correctly in 4.0.1. I've attached the test razor file.
Here is a TelerikForm with a FormItem (1) for a boolean field. Another FormItem (2) should render, depending on the boolean field (1). This does not work with a TelerikForm, but works with a standard EditForm.
The workaround for a TelerikForm is to use a FormItem Template with a TelerikCheckBox. This is demonstrated below as well.
<EditForm Model="@_data">
<label>Condition 1 (InputCheckbox):</label>
<InputCheckbox @bind-Value="@_data.Value1" />
<br />
@if (_data.Value1)
{
<label>Result 2</label>
<InputCheckbox DisplayName="Result 2:" @bind-Value="@_data.Value2"></InputCheckbox>
}
</EditForm>
<h1>TelerikForm</h1>
<TelerikForm Model="@_data">
<FormItems>
<FormItem LabelText="Condition 1 (FormItem):" Field="@nameof(_data.Value1)"></FormItem>
<FormItem>
<Template>
<label for="x">Condition 1 (TelerikCheckBox):</label>
<br />
<TelerikCheckBox Id="x" @bind-Value="_data.Value1" />
</Template>
</FormItem>
@if (_data.Value1)
{
<FormItem LabelText="Result 2:" Field="@nameof(_data.Value2)"></FormItem>
}
</FormItems>
</TelerikForm>
@code {
private ExampleDto _data { get; set; } = new ExampleDto();
public class ExampleDto
{
public string TextValue { get; set; }
public bool Value1 { get; set; }
public bool Value2 { get; set; }
}
}
Hi,
I came across some unusual behaviour
I wanted to hide the default form submit button so I could put it elsewhere on the page but once I had an empty FormButton element on the page I was unable to print any more
<FormButtons></FormButtons>a solution to my problem was to put an empty span in the element
<FormButtons><span></span></FormButtons>
The Validation does not trigger when I load my model from an async method.
<AdminEdit>
A workaround for the time being:
@inject HttpClient http
@using System.ComponentModel.DataAnnotations
<TelerikForm @ref="@EditForm"
Model="@TheCatFactTelerik"
ValidationMessageType="@FormValidationMessageType.None">
<FormValidation>
<ValidationSummary />
</FormValidation>
<FormItems>
<FormItem Field="fact">
</FormItem>
</FormItems>
<FormButtons>
<TelerikButton ButtonType="ButtonType.Submit" Primary="true">Apply</TelerikButton>
</FormButtons>
</TelerikForm>
@code {
public TelerikForm EditForm { get; set; }
public CatFact TheCatFactTelerik = new CatFact();
public EditContext editContext { get; set; }
protected async override Task OnInitializedAsync()
{
TheCatFactTelerik = await http.GetFromJsonAsync<CatFact>("https://catfact.ninja/fact");
}
protected override async Task OnAfterRenderAsync(bool firstRender)
{
EditForm.EditContext.AddDataAnnotationsValidation();
}
public class CatFact
{
[Required(ErrorMessage = "Required Error Text")]
[MinLength(10, ErrorMessage = "Min Length 10")]
public string fact { get; set; }
public int length { get; set; }
}
}</AdminEdit>
I have a simple TelerikForm using required validation but for some reason when I set the model via an async call to the server the validation doesn't fire. I am using the same form when I add a new item and the validation is working fine.
