InputRadio & InputRadioGroup Components in Blazor | .NET 5

InputRadio & InputRadioGroup Components in Blazor:

@page "/radio2"
@using System.ComponentModel.DataAnnotations
@using BlazorInputRadioDemo.Data

<h1>.NET 5 InputRadio Component</h1>


<editform model="sub" onvalidsubmit="HandleSubmit">
    <dataannotationsvalidator>

    <p>
        <inputradiogroup bind-value="sub.ProgLanguage">
            Programming Language:
            <br />
            @foreach (var lang in (ProgLanguage[])Enum.GetValues(typeof(ProgLanguage)))
            {
                <inputradio value="lang">
                @lang
                <br />

            }

        </inputradio></inputradiogroup>
    </p>

    <p>
        Pick One Language and One Book :<br />
        <inputradiogroup bind-value="sub.Language" name="language">
            <inputradiogroup bind-value="sub.Book" name="book">
                <inputradio name="language" value="Language.CSharp">C Sharp <br />
                <inputradio name="book" value="Book.CSharpBook">C Sharp Book <br />

                <inputradio name="language" value="Language.Java">Java <br />
                <inputradio name="book" value="Book.JavaBook">Java Book <br />

                <inputradio name="language" value="Language.VB">VB <br />
                <inputradio name="book" value="Book.VBBook">VB Book <br />

                <inputradio name="language" value="Language.Python">Python <br />
                <inputradio name="book" value="Book.PythonBook">Python Book <br />
            </inputradio></inputradio></inputradio></inputradio></inputradio></inputradio></inputradio></inputradio></inputradiogroup>
        </inputradiogroup>


    </p>



    <validationsummary>
    <button class="btn btn-success" type="submit">Submit</button>

</validationsummary></dataannotationsvalidator></editform>


<p>@message</p>


@code {
    Subject sub = new Subject();
    string message;

    void HandleSubmit()
    {
        message = $"Thanks for select {sub.ProgLanguage}";
    }
}


==================================


namespace BlazorInputRadioDemo.Data
{
    public class Subject
    {
        [Required]
        [Range(typeof(ProgLanguage), nameof(ProgLanguage.CSharp), nameof(ProgLanguage.PHP), ErrorMessage = "Pick a Programming Language.")]
        public ProgLanguage ProgLanguage { get; set; } = ProgLanguage.Unknown;


        [Required, EnumDataType(typeof(Language))]
        public Language? Language { get; set; } = null;

        [Required, EnumDataType(typeof(Book))]
        public Book? Book { get; set; } = null;
    }
    public enum ProgLanguage { CSharp,Java , VB, Python, PHP, Unknown }

    public enum Language { CSharp, Java, VB, Python, PHP, Unknown }
    public enum Book { CSharpBook, JavaBook, VBBook, PythonBook, PHPBook, Unknown }
}

Video Link:

Post a Comment

0 Comments