hi,
We are building a reporting app, where the inputs change from one report to another and is part of the report configuration. So all the input fields are being dynamically added. I am running a foreach loop and will determine which type of input component to be added. Also I am using a generic Dictionary<string, object> to store the input values and in the component binding, I am using @bind-Value="@inputValues[inputConfig.name]" where inputValues is the Dictionary. So some input may be DatePicker, textbox, dropdownlist etc (all from Radzen component library). This approach works fine as long as I don't have any validations. Now, I have added RadzenCustomValidator (one for each component).
Below is the code. There are other types also like dropdownlist. I have excluded it for brevity.
<RadzenTemplateForm TItem="Dictionary<string, object>"
OnValidSubmit="@ValidateInputGenerateReport">
<ChildContent>
<RadzenStack Orientation="Orientation.Horizontal" Gap="0.5rem" Wrap="FlexWrap.Wrap">
@foreach (var inputConfig in InputFields)
{
<RadzenStack Orientation="Orientation.Horizontal" Gap="0.5rem" Wrap="FlexWrap.Wrap">
<RadzenLabel Text="@($"{inputConfig.Label}:")" Style="align-self: center; margin-right: 5px;"></RadzenLabel>
<RadzenStack Orientation="Orientation.Vertical">
@switch (inputConfig.type)
{
case "Date":
<RadzenDatePicker @bind-Value="@inputValues[inputConfig.name]"
Placeholder="@inputConfig.Label"
Name="@inputConfig.ComponentName"
ShowCalendarWeek
InitialViewDate="@DateTime.Now"
ShowTime="false" DateFormat="yyyy-MM-dd"
Style="width: 200px; margin-right: 10px;" />
break;
case "text":
<RadzenTextBox @bind-Value="inputConfig.value"
Placeholder="@inputConfig.Label"
Name="@inputConfig.ComponentName"
Style="width: 200px; margin-right: 10px;" />
break;
}
<RadzenCustomValidator Component="@inputConfig.ComponentName"
Style="color: red;"
Text="@GetValidationMessage(inputConfig.ComponentName)"
Validator="@(() => ValidateField(inputConfig))" />
</RadzenStack>
</RadzenStack>
}
<RadzenStack Orientation="Orientation.Horizontal" Gap="0.5rem">
<RadzenButton Text="@ReportConfig.ActionLabel" ButtonType="ButtonType.Submit"
Style="min-width: 8rem;"
/>
<RadzenButton Text="@ReportConfig.ResetLabel" ButtonType="ButtonType.Reset" ButtonStyle="ButtonStyle.Danger"
Style="min-width: 8rem;"
Click="@ResetInputs" />
</RadzenStack>
</RadzenStack>
</ChildContent>
</RadzenTemplateForm>
Now in order to show the message from validator, when I add EditContext="@editcontext" to RadzenTemplateform, I encounter below error while rendering a RadzenDatePicker. If I dont use EditContext, RadzenDatePicker is rendered properly with whatever default value is set. Other input fields like dropdownlist, textbox gets rendered properly both with and without EditContext.
Error: System.InvalidOperationException: Unable to evaluate index expressions of type 'PropertyExpression'.
at Microsoft.AspNetCore.Components.Forms.ExpressionFormatter.FormatIndexArgument(Expression indexExpression, ReverseStringBuilder& builder)
at Microsoft.AspNetCore.Components.Forms.ExpressionFormatter.FormatIndexArgument(Expression indexExpression)
at Microsoft.AspNetCore.Components.Forms.FieldIdentifier.ParseAccessor[T](Expression`1 accessor, Object& model, String& fieldName)
at Microsoft.AspNetCore.Components.Forms.FieldIdentifier.Create[TField](Expression`1 accessor)
at Radzen.Blazor.RadzenDatePicker`1.SetParametersAsync(ParameterView parameters)
I am not sure where is the issue specific to DatePicker?
The other issue that I am facing is that when I click on the Button, nothing happens. If I explicitly add Click="@ValidateInputGenerateReport", then only the method gets invoked, even though on the TemplateForm, I have OnValidSubmit="@ValidateInputGenerateReport".
Third issue is that I am unable to get the validation errors displayed.
Thanks!