Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Validation is not working for RadioGroup #1231

Closed
Hakim83 opened this issue Aug 9, 2020 · 2 comments · Fixed by #1561
Closed

Validation is not working for RadioGroup #1231

Hakim83 opened this issue Aug 9, 2020 · 2 comments · Fixed by #1561
Labels
Type: Bug 🐞 Something isn't working
Milestone

Comments

@Hakim83
Copy link

Hakim83 commented Aug 9, 2020

Is your feature request related to a problem? Please describe.
I'm trying to validate RadioGroup in a Form using annotation, validation works well for 'Select' component but not for 'RadioGroup':

@*Valdiation for Select works well*@
<Validations Model="@selectOption">
    <Validation>
        <Select TValue="string" @bind-SelectedValue="selectOption.Text">
            <ChildContent>
                <SelectItem Value="@(string.Empty)"></SelectItem>
                <SelectItem Value="@("Option 1")">Option 1</SelectItem>
                <SelectItem Value="@("Option 2")">Option 2</SelectItem>
            </ChildContent>
            <Feedback>
                <ValidationError />
            </Feedback>
        </Select>
    </Validation>
</Validations>

@*a similar validation for RadioGroup is not working*@
<Validations Model="@radioOption">
    <Validation>
        <RadioGroup TValue="string" @bind-SelectedValue="radioOption.Text">
            <ChildContent>
                <Radio Value="@("Option 1")">Option 1</Radio>
                <Radio Value="@("Option 2")">Option 2</Radio>
            </ChildContent>
            <Feedback>
                <ValidationError />
            </Feedback>
        </RadioGroup>
    </Validation>
</Validations>

@code{
	MyOption selectOption = new MyOption();
        MyOption radioOption = new MyOption();
       class MyOption
       {
          [Required]
          public string Text { get; set; }
       }
}

Describe the solution you'd like
Validation for RadioGroup when using annotation for models.

Additional context

@dfkeenan
Copy link
Contributor

I would also like this. I had a quick go. Unfortunately some key pieces are internal. I was hoping it would be as simple as:

protected override void OnInitialized()
{
    ParentValidation?.InitializeInputExpression(this.CheckedExpression);
    base.OnInitialized();
}

But InitializeInputExpression is internal. And the CheckedExpression parameter should be called CheckedValueExpression. I did get to to work sort of by doing:

public static class BlazoriseWorkarounds
{
    const System.Reflection.BindingFlags bindings = System.Reflection.BindingFlags.NonPublic | System.Reflection.BindingFlags.Instance;
    private static readonly MethodInfo initializeInputExpression = typeof(Blazorise.Validation).GetMethod(nameof(InitializeInputExpression), bindings);


    public static void InitializeInputExpression<T>(this Blazorise.Validation validation, Expression<Func<T>> expression)
    {
        initializeInputExpression.MakeGenericMethod(typeof(T)).Invoke(validation, new[] { expression });
    }
}

public partial class RadioGroupFix<TValue> : RadioGroup<TValue>
{
    protected override void OnInitialized()
    {
        ParentValidation?.InitializeInputExpression(this.CheckedValueExpression);
        base.OnInitialized();
    }

    protected override void BuildClasses(ClassBuilder builder)
    {
        builder.Append(ClassProvider.SelectValidation(ParentValidation?.Status ?? ValidationStatus.None), ParentValidation?.Status != ValidationStatus.None);
        base.BuildClasses(builder);
    }

    [Parameter] public Expression<Func<TValue>> CheckedValueExpression { get; set; }
}

And changing the razor to include the Feedback like so:

@typeparam TValue
@inherits RadioGroup<TValue>
@if (!HasCustomRegistration)
{
    <CascadingValue Value=this>
        <div class="@ClassNames" style="@StyleNames" @attributes="@Attributes">
            @ChildContent
        </div>
    </CascadingValue>
    @Feedback
}
else
{
    @RenderCustomComponent()
}

@stsrki stsrki added the Type: Bug 🐞 Something isn't working label Dec 1, 2020
@stsrki stsrki added this to the 0.9.2 milestone Dec 1, 2020
@stsrki stsrki linked a pull request Dec 2, 2020 that will close this issue
@stsrki stsrki mentioned this issue Dec 2, 2020
21 tasks
@stsrki stsrki closed this as completed Dec 2, 2020
@stsrki
Copy link
Collaborator

stsrki commented Dec 2, 2020

I forgot to let you know. I fixed the bug but you also had an invalid RadioGroup usage

<RadioGroup TValue="string" @bind-SelectedValue="radioOption.Text">

should be

<RadioGroup TValue="string" @bind-CheckedValue="radioOption.Text">

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Type: Bug 🐞 Something isn't working
Projects
Archived in project
Development

Successfully merging a pull request may close this issue.

3 participants