Unplanned
Last Updated: 15 Sep 2021 13:59 by Frederic
Created by: Frederic
Comments: 2
Category: DropDownList
Type: Bug Report
8

When used in Bootstrap Grid the DropDownList popup is misaligned on the first open. On a second click, it is aligned.

This behavior is also valid for Combobox and Autocomplete.

Reproduction code:

 

<div class="box">
    <div class="row mt-3" style="align-items:center">
        <div class="col-12 col-lg-4">
            <span class="bold">ComboBox</span>
        </div>
        <div class="col">
            <TelerikComboBox Data="@myComboData" TextField="ComboTextField" ValueField="ComboValueField"
                             @bind-Value="selectedCombo" ClearButton="true" Filterable="true">
            </TelerikComboBox>
        </div>
    </div>

    <div class="row mt-3" style="align-items:center">
        <div class="col-12 col-lg-4">
            <span class="bold">DropDownList</span>
        </div>
        <div class="col">
            <TelerikDropDownList Data="@myDdlData" TextField="MyTextField" ValueField="MyValueField"
                                 @bind-Value="@selectedDropDown">
            </TelerikDropDownList>
        </div>
    </div>

    <div class="row mt-3" style="align-items:center">
        <div class="col-12 col-lg-4">
            <span class="bold">Autocomplete</span>
        </div>
        <div class="col">
            <TelerikAutoComplete Data="@Suggestions" @bind-Value="@AutoCompleteValue"
                                 ClearButton="true" />
        </div>
    </div>
</div>

@code {
    public int selectedDropDown { get; set; }
    public int selectedCombo { get; set; }
    public string AutoCompleteValue { get; set; }

    //ComboBox
    public class ComboModel
    {
        public int ComboValueField { get; set; }
        public string ComboTextField { get; set; }
    }

    IEnumerable<ComboModel> myComboData = Enumerable.Range(1, 20).Select(x => new ComboModel { ComboTextField = "item " + x, ComboValueField = x });

    //DropDownList
    public class MyDdlModel
    {
        public int MyValueField { get; set; }
        public string MyTextField { get; set; }
    }

    IEnumerable<MyDdlModel> myDdlData = Enumerable.Range(1, 20).Select(x => new MyDdlModel { MyTextField = "item " + x, MyValueField = x });

    //Autocomplete
    List<string> Suggestions { get; set; } = new List<string> {
        "Manager", "Developer", "QA", "Technical Writer", "Support Engineer", "Sales Agent", "Architect", "Designer"
    };
}

 

Completed
Last Updated: 13 Sep 2021 05:08 by ADMIN
Release 2.27.0
When I use the Chrome Lighthouse (based on the axe accessibility testing tool) to assess the accessibility of the TelerikDropDownList I am getting several issues.
Completed
Last Updated: 13 Sep 2021 05:07 by ADMIN
Release 2.27.0
Created by: Van Patrick
Comments: 0
Category: DropDownList
Type: Bug Report
1
Current

aria-describedby="a112a6d1-5585-48b0-a138-22edbc0b0bda "

Expected

aria-describedby="a112a6d1-5585-48b0-a138-22edbc0b0bda"
Completed
Last Updated: 13 Sep 2021 05:07 by ADMIN
Release 2.27.0
Created by: Xiaobo
Comments: 0
Category: DropDownList
Type: Bug Report
3
Missing label causes an accessibility issue:  The select element must have an accessible name
Completed
Last Updated: 11 Aug 2021 16:10 by ADMIN
Created by: Clark
Comments: 6
Category: DropDownList
Type: Bug Report
0
I've encountered a scenario where a DropDownList's red border (due to validation status) will be displayed or hidden when it shouldn't. It seems to be always one step behind. For example:

1. Submit the empty form to trigger validation. A validation message is displayed and the field shows a red border as expected.
2. Select a valid value. The validation message goes away as expected, but the red border remains.
3. Select an invalid value. The validation message appears, but now the red border disappears.
4. Select a valid value. The validation message goes away, but the red border remains.

Interestingly, this only happens when using the keyboard. Using the mouse, the border is displayed/hidden at the same time the validation message is displayed/hidden, as would normally be expected.

So to cause this: tab into the field, press one key (e.g., a letter or the down arrow) to select a value, then tab out of the field. If you change the value more than once, the red border will disappear the second time if it is also a valid value.

Animated demo:



I've encountered almost the exact same scenario with other fields when using async validation rules (which Blazor currently does not support), leading me to believe the DropDownList control may be using async somewhere that's resulting in this problem.

Additionally, I'm only experiencing this when I'm wrapping the DropDownList control in my own custom component. I'm not sure why this is.

---

I've included a page and components that demonstrate this problem. It's a little messy but hopefully sheds some light on when it does and doesn't occur. It shows:

1. The issue happens to the TelerikDropDownList when wrapped in a custom component but not otherwise.
2. The issue does not happen to Microsoft's built-in InputSelect even if wrapped in a custom component.
3. The issue does not happen to TelerikTextBox even if wrapped in a custom component.
4. The values of CssClass and InputClass differ, indicating that validation only completes after the value has been changed and OnParametersSet() has been called. (async issue?)

In the attached demo page, the issue only occurs in the last field ("TelerikDropDownListWrapped").

---

Seems like this is a bug with TelerikDropDownList. If not a bug, how can I avoid this issue and why does it not occur with other controls?
Unplanned
Last Updated: 15 Jun 2021 17:12 by ADMIN

---

ADMIN EDIT

The filter input gets focus, which shows the soft keyboard, which changes the viewport size, which causes the dropdown to hide. Unfortunately, there is no workaround at the moment (except perhaps disabling filtering for small viewports).

---

Unplanned
Last Updated: 14 Jun 2021 09:47 by ADMIN
The validation Tooltip does not show correctly when hovering from the icon to the select element in the DropDownList
Duplicated
Last Updated: 08 Jun 2021 16:08 by ADMIN
Created by: Chris
Comments: 1
Category: DropDownList
Type: Bug Report
0

The drop down list component does not allow the user to associate a label with the underlying html select input control, which goes against accessibility standards. It appears that most, if not all, of the other components follow the accessibility standards. Please fix the drop down list and/or allow attribute splatting so that developers can apply their own attributes (like aria-label) to meet accessibility standards.

Unplanned
Last Updated: 04 May 2021 05:03 by ADMIN
the dropdown options display correctly until some come from a second service call.

The problem is that if the selected option is in the options added later then it does not show it as the selected value.

Example below shows correct function for "6" but incorrect for "7".

---

ADMIN EDIT

Here is a reproducible with the workaround highlighted in green:

@using System.Collections.ObjectModel

<h4>Option Selected: 6 @selectedSix</h4>
<br />

<TelerikDropDownList Data="@myDdlData"
                     TextField="MyTextField"
                     ValueField="MyValueField"
                     @bind-Value="@selectedSix" />

<h4>Option Selected: 7 @selectedSeven</h4>
<br />

<TelerikDropDownList Data="@myDdlData"
                     TextField="MyTextField"
                     ValueField="MyValueField"
                     @bind-Value="@selectedSeven">
</TelerikDropDownList>

<TelerikButton OnClick="@AddOption">Add Item</TelerikButton>

<ul>
    @foreach (var item in myDdlData)
    {
        <li>@item.MyValueField</li>
    }
</ul>

@code {
    int selectedSix { get; set; } = 6;
    int selectedSeven { get; set; } = 7;

    ObservableCollection<MyDdlModel> myDdlData = new ObservableCollection<MyDdlModel>(Enumerable.Range(1, 5).Select(x => new MyDdlModel { MyTextField = "item " + x, MyValueField = x }));

    protected override async Task OnInitializedAsync()
    {
        AddOption();

        await Task.Delay(TimeSpan.FromSeconds(1));

        AddOption();
    }

    void AddOption()
    {
        myDdlData.Add(new MyDdlModel { MyTextField = "item " + (myDdlData.Count + 1), MyValueField = myDdlData.Count + 1 });

        int origSelection = selectedSeven;
        selectedSeven = 0;
        StateHasChanged();
        //add this if it does not work
        //await Task.Delay(30);//wait a rendering frame
        selectedSeven = origSelection;
        //add this if it does not work
        //StateHasChanged();
    }

    public class MyDdlModel
    {
        public int MyValueField { get; set; }
        public string MyTextField { get; set; }
    }
}

---

Duplicated
Last Updated: 22 Feb 2021 10:10 by ADMIN

I have two cascaded dropdownlists, in attached example car brands and selectable colors. The dependent dropdown has defaulttext option. After the parent dropdown has changed, in its event handler I reload the dependent data source and set a new valid value. If the data source does not contain the previous (!) value, the dropdownlist calls the valuechanged callback with default value. In next round when dependent dropdown holds the default value, after reloading datasource it works as expected. And parent changes again, if the updated datasource does not contain the previous dependent value the dropdownlist sets its value to default.

When I do not pass defaulttext parameter, the dependent dropdown selects the first element from the updated datasource. In my case it is not acceptable because I want to set a specific value (in this example the default color), not the first and not the default.

This feedback drives me to try setting value to default and wait for re-render the descendant dropdownlist before set the wanted value. 

Is there any way to avoid this behaviour of the dropdownlist?


<TelerikDropDownList TItem="Brand"
			 TValue="int"
			 ValueField=@nameof(Brand.Id)
			 TextField=@nameof(Brand.Name)
			 Data="@BrandList"
			 Value="@Data.BrandId"
			 ValueChanged=@OnBrandChanged />

<TelerikDropDownList TItem="Color"
			 TValue="int"
			 ValueField=@nameof(Brand.Id)
			 TextField=@nameof(Brand.Name)
			 Data="@FilteredColorList"
			 Value="@Data.ColorId"
			 ValueChanged="@OnColorChanged"
			 DefaultText="select color ..." />

async Task OnBrandChanged(int brandId) { Data.ColorId = default; await Task.Delay(5);

Data.BrandId = brandId; Data.ColorId = GetDefaultColor(brandId); FilteredColorList = GetFilteredColorList(brandId); }


Completed
Last Updated: 15 Feb 2021 12:25 by ADMIN
Release 2.22.0
When I change the PopupHeight dynamically (based on the number of items in my data source), the change is not reflected in the component.
Completed
Last Updated: 04 Feb 2021 16:00 by ADMIN
Release 2.22.0
Created by: Barry
Comments: 0
Category: DropDownList
Type: Bug Report
1

When the Default text value is changed by some business logic, the component does not react to that change to update the Default text value in the view model.

DropDownList should re-render on change of the Default text parameter

Completed
Last Updated: 17 Sep 2020 10:55 by ADMIN
Release 2.18.0
I have logic that updates the Data of a dropdownlist (in this case, changes the value of the TextField of a the selected item in the dropdown). After the database update, I fetch the dropdown data anew, and it reflects in the dropdown element, but not in the main element where it is currently shown.
Unplanned
Last Updated: 01 Sep 2020 12:37 by ADMIN
When I place a DropDownList inside a Modal Window and run it in Safari there is a flicker in the UI when the dropdown is expanded.
Completed
Last Updated: 23 Jun 2020 07:39 by ADMIN
Release 2.15.0

Clicking on the <label> opens the dropdown, but clicking on its main element does not

Selected value: @selectedValue
<br />
<label>some label for the dropdown, open it and test whether clicking outside closes it
    <TelerikDropDownList Data="@myDdlData" TextField="MyTextField" ValueField="MyValueField" @bind-Value="selectedValue">
    </TelerikDropDownList>
</label>

@code {
    //in a real case, the model is usually in a separate file
    //the model type and value field type must be provided to the dropdpownlist
    public class MyDdlModel
    {
        public int MyValueField { get; set; }
        public string MyTextField { get; set; }
    }

    IEnumerable<MyDdlModel> myDdlData = Enumerable.Range(1, 20).Select(x => new MyDdlModel { MyTextField = "item " + x, MyValueField = x });

    int selectedValue { get; set; } = 3; //usually the current value should come from the model data
}

Declined
Last Updated: 23 Apr 2020 20:49 by Ben Hayat
Created by: Rob
Comments: 9
Category: DropDownList
Type: Bug Report
1
The Telerik drop down list seems to be very slow from initial click to when the list is shown. Other Telerik drop down components outside of the Blazor suite seem to be much more responsive and quick. In it's current state I would consider it unusable and will need to switch to InputSelect. Has this been reported or observed before?
Won't Fix
Last Updated: 31 Mar 2020 09:10 by ADMIN
Scheduled for 2.10.0

Before, the Value from the first item in the Data was populated through @bind-Value to the view model. It no longer is.

In the following snippet, I expect to see "1" in the initial load of the page, but I see "0" - the default value for the integer.

@selectedValue

<TelerikDropDownList Data="@myDdlData" TextField="MyTextField" ValueField="MyValueField" @bind-Value="@selectedValue">
</TelerikDropDownList>

@code {
    //in a real case, the model is usually in a separate file
    //the model type and value field type must be provided to the dropdpownlist
    public class MyDdlModel
    {
        public int MyValueField { get; set; }
        public string MyTextField { get; set; }
    }

    IEnumerable<MyDdlModel> myDdlData = Enumerable.Range(1, 20).Select(x => new MyDdlModel { MyTextField = "item " + x, MyValueField = x });

    int selectedValue { get; set; }
}

Unplanned
Last Updated: 13 Feb 2020 10:19 by ADMIN

Hi!

When i use combination of LINQ inside TelerikDropDownLists Data attribute and TelerikGrid 's GridEditMode.Popup mode, i get weird behavior when i try to select an item from TelerikDropDownLists - everything freezes. Please check the solution. Everything works fine if i don't use LINQ or GridEditMode.Popup mode.

 

Thank you!

Completed
Last Updated: 12 Dec 2019 12:39 by ADMIN
Release 2.5.1
Created by: Emil
Comments: 1
Category: DropDownList
Type: Bug Report
0

Hello,

Initial I want no item to be selected to let the user select a value. I thought it would be enough if my bindvalue would be of a nullable type. I'm getting an exception when trying. If this is not supported, how can I do it?

 

     <div class="form-group col-md-2">
        <label class="col-form-label" for="ddReleaseType">Fönstertyp</label>
        <TelerikDropDownList Data="@ReleaseTypeFilterOptions" @bind-Value="FilterState.ReleaseType" TextField="DisplayText" ValueField="ReleaseType" Class="max-width form-control" @ref="ddReleaseType"></TelerikDropDownList>
    </div>

     public enum ReleaseType : int
    {
        All = 0,
        Category = 1,
        Season = 2,
        Misc = 3
    }

    public class FilterState
    {
        public ReleaseType? ReleaseType { get; set; }
    }

 

        protected Telerik.Blazor.Components.TelerikDropDownList<ReleaseTypeFilterModel?, SessionState.ReleaseType?> ddReleaseType;
 

        protected class ReleaseTypeFilterModel
        {
            public SessionState.ReleaseType ReleaseType { get; set; }
            public string DisplayText { get { return ReleaseType.ToString(); } }
        }
 

 

 

 

An unhandled exception occurred while processing the request.

InvalidOperationException: Telerik.Blazor.Components.TelerikDropDownList`2[ReleaseCalendar.Pages.IndexBase+ReleaseTypeFilterModel,System.Nullable`1[ReleaseCalendar.SessionState.ReleaseType]] does not support the type 'System.Nullable`1[ReleaseCalendar.SessionState.ReleaseType]'.

Telerik.Blazor.Components.Common.TelerikSelectBase<TItem, TValue>.TryParseValueFromString(string value, out TValue result, out string validationErrorMessage)

 

    • Telerik.Blazor.Components.Common.TelerikSelectBase<TItem, TValue>.TryParseValueFromString(string value, out TValue result, out string validationErrorMessage)

    • Telerik.Blazor.Components.Common.TelerikSelectBase<TItem, TValue>.set_CurrentValueAsString(string value)

    • Telerik.Blazor.Components.TelerikDropDownListBase<TItem, TValue>.OnParametersSet()

    • Microsoft.AspNetCore.Components.ComponentBase.CallOnParametersSetAsync()

    • Microsoft.AspNetCore.Components.ComponentBase.RunInitAndSetParametersAsync()

    • Microsoft.AspNetCore.Components.Rendering.HtmlRenderer.HandleException(Exception exception)

    • Microsoft.AspNetCore.Components.RenderTree.Renderer.AddToPendingTasks(Task task)

    • Microsoft.AspNetCore.Components.Rendering.ComponentState.SetDirectParameters(ParameterView parameters)

    • Microsoft.AspNetCore.Components.RenderTree.RenderTreeDiffBuilder.InitializeNewComponentFrame(ref DiffContext diffContext, int frameIndex)

    • Microsoft.AspNetCore.Components.RenderTree.RenderTreeDiffBuilder.InitializeNewSubtree(ref DiffContext diffContext, int frameIndex)

    • Microsoft.AspNetCore.Components.RenderTree.RenderTreeDiffBuilder.InsertNewFrame(ref DiffContext diffContext, int newFrameIndex)

    • Microsoft.AspNetCore.Components.RenderTree.RenderTreeDiffBuilder.AppendDiffEntriesForRange(ref DiffContext diffContext, int oldStartIndex, int oldEndIndexExcl, int newStartIndex, int newEndIndexExcl)

    • Microsoft.AspNetCore.Components.RenderTree.RenderTreeDiffBuilder.ComputeDiff(Renderer renderer, RenderBatchBuilder batchBuilder, int componentId, ArrayRange<RenderTreeFrame> oldTree, ArrayRange<RenderTreeFrame> newTree)

    • Microsoft.AspNetCore.Components.Rendering.ComponentState.RenderIntoBatch(RenderBatchBuilder batchBuilder, RenderFragment renderFragment)

    • Microsoft.AspNetCore.Components.RenderTree.Renderer.RenderInExistingBatch(RenderQueueEntry renderQueueEntry)

    • Microsoft.AspNetCore.Components.RenderTree.Renderer.ProcessRenderQueue()

    • Microsoft.AspNetCore.Components.Rendering.HtmlRenderer.HandleException(Exception exception)

    • Microsoft.AspNetCore.Components.RenderTree.Renderer.ProcessRenderQueue()

    • Microsoft.AspNetCore.Components.RenderTree.Renderer.ProcessPendingRender()

    • Microsoft.AspNetCore.Components.RenderTree.Renderer.AddToRenderQueue(int componentId, RenderFragment renderFragment)

    • Microsoft.AspNetCore.Components.ComponentBase.StateHasChanged()

    • Microsoft.AspNetCore.Components.ComponentBase.CallOnParametersSetAsync()

    • Microsoft.AspNetCore.Components.ComponentBase.RunInitAndSetParametersAsync()

    • Microsoft.AspNetCore.Components.Rendering.HtmlRenderer.HandleException(Exception exception)

    • Microsoft.AspNetCore.Components.RenderTree.Renderer.AddToPendingTasks(Task task)

    • Microsoft.AspNetCore.Components.Rendering.ComponentState.SetDirectParameters(ParameterView parameters)

    • Microsoft.AspNetCore.Components.RenderTree.Renderer.RenderRootComponentAsync(int componentId, ParameterView initialParameters)

    • Microsoft.AspNetCore.Components.Rendering.HtmlRenderer.CreateInitialRenderAsync(Type componentType, ParameterView initialParameters)

    • Microsoft.AspNetCore.Components.Rendering.HtmlRenderer.RenderComponentAsync(Type componentType, ParameterView initialParameters)

    • Microsoft.AspNetCore.Components.Rendering.RendererSynchronizationContext+<>c__11<TResult>+<<InvokeAsync>b__11_0>d.MoveNext()

    • Microsoft.AspNetCore.Mvc.ViewFeatures.StaticComponentRenderer.PrerenderComponentAsync(ParameterView parameters, HttpContext httpContext, Type componentType)

    • Microsoft.AspNetCore.Mvc.ViewFeatures.ComponentRenderer.PrerenderedServerComponentAsync(HttpContext context, ServerComponentInvocationSequence invocationId, Type type, ParameterView parametersCollection)

    • Microsoft.AspNetCore.Mvc.ViewFeatures.ComponentRenderer.RenderComponentAsync(ViewContext viewContext, Type componentType, RenderMode renderMode, object parameters)

    • Microsoft.AspNetCore.Mvc.TagHelpers.ComponentTagHelper.ProcessAsync(TagHelperContext context, TagHelperOutput output)

    • Microsoft.AspNetCore.Razor.Runtime.TagHelpers.TagHelperRunner.<RunAsync>g__Awaited|0_0(Task task, TagHelperExecutionContext executionContext, int i, int count)

    • ReleaseCalendar.Pages.Pages__Host.<ExecuteAsync>b__14_1() in _Host.cshtml

      1.     <app><component type="typeof(App)" render-mode="ServerPrerendered" /></app>
    • Microsoft.AspNetCore.Razor.Runtime.TagHelpers.TagHelperExecutionContext.SetOutputContentAsync()

    • ReleaseCalendar.Pages.Pages__Host.ExecuteAsync()

    • Microsoft.AspNetCore.Mvc.Razor.RazorView.RenderPageCoreAsync(IRazorPage page, ViewContext context)

    • Microsoft.AspNetCore.Mvc.Razor.RazorView.RenderPageAsync(IRazorPage page, ViewContext context, bool invokeViewStarts)

    • Microsoft.AspNetCore.Mvc.Razor.RazorView.RenderAsync(ViewContext context)

    • Microsoft.AspNetCore.Mvc.ViewFeatures.ViewExecutor.ExecuteAsync(ViewContext viewContext, string contentType, Nullable<int> statusCode)

    • Microsoft.AspNetCore.Mvc.ViewFeatures.ViewExecutor.ExecuteAsync(ViewContext viewContext, string contentType, Nullable<int> statusCode)

    • Microsoft.AspNetCore.Mvc.Infrastructure.ResourceInvoker.<InvokeNextResultFilterAsync>g__Awaited|29_0<TFilter, TFilterAsync>(ResourceInvoker invoker, Task lastTask, State next, Scope scope, object state, bool isCompleted)

    • Microsoft.AspNetCore.Mvc.Infrastructure.ResourceInvoker.Rethrow(ResultExecutedContextSealed context)

    • Microsoft.AspNetCore.Mvc.Infrastructure.ResourceInvoker.ResultNext<TFilter, TFilterAsync>(ref State next, ref Scope scope, ref object state, ref bool isCompleted)

    • Microsoft.AspNetCore.Mvc.Infrastructure.ResourceInvoker.InvokeResultFilters()

    • Microsoft.AspNetCore.Mvc.Infrastructure.ResourceInvoker.<InvokeNextResourceFilter>g__Awaited|24_0(ResourceInvoker invoker, Task lastTask, State next, Scope scope, object state, bool isCompleted)

    • Microsoft.AspNetCore.Mvc.Infrastructure.ResourceInvoker.Rethrow(ResourceExecutedContextSealed context)

    • Microsoft.AspNetCore.Mvc.Infrastructure.ResourceInvoker.Next(ref State next, ref Scope scope, ref object state, ref bool isCompleted)

    • Microsoft.AspNetCore.Mvc.Infrastructure.ResourceInvoker.InvokeFilterPipelineAsync()

    • Microsoft.AspNetCore.Mvc.Infrastructure.ResourceInvoker.<InvokeAsync>g__Logged|17_1(ResourceInvoker invoker)

    • Microsoft.AspNetCore.Routing.EndpointMiddleware.<Invoke>g__AwaitRequestTask|6_0(Endpoint endpoint, Task requestTask, ILogger logger)

    • Microsoft.AspNetCore.Diagnostics.DeveloperExceptionPageMiddleware.Invoke(HttpContext context)


Completed
Last Updated: 26 Jul 2019 07:50 by ADMIN
Release 1.4.0

When bound to a nullable GUID, the DropDownList invokes validation and shows validation messages as soon as the view loads.

Expected: the same behavior as with nullable int - validation is to be triggered by the form submission or selection from the dropdown.

Worked as expected in 1.2.0.

Reproducible:

@using Telerik.Blazor.Components.DropDownList
@using System.ComponentModel.DataAnnotations
 
<EditForm Model="@person" OnValidSubmit="@HandleValidSubmit">
    <DataAnnotationsValidator />
    <ValidationSummary />
    <p class="gender">
        Gender: <TelerikDropDownList @bind-Value="person.Gender" DefaultItem="@ddlHint"
                                   Data="@genders" TextField="MyTextField" ValueField="MyValueField">
        </TelerikDropDownList>
        <ValidationMessage For="@(() => person.Gender)"></ValidationMessage>
    </p>
 
    <button type="submit">Submit</button>
</EditForm>
 
@code {
    // Usually the model classes would be in different files
    public class Person
    {
        [Required(ErrorMessage = "Gender is mandatory.")]//the value field in the dropdown model must be null in the default item
        public Guid? Gender { get; set; }
    }
 
    public class MyDdlModel
    {
        //nullable so the default item can allow required field validation
        public Guid? MyValueField { get; set; }
        public string MyTextField { get; set; }
    }
 
    Person person = new Person();
 
    MyDdlModel ddlHint = new MyDdlModel { MyValueField = null, MyTextField = "Gender" };
 
    IEnumerable<MyDdlModel> genders = new List<MyDdlModel>
{
        new MyDdlModel {MyTextField = "female", MyValueField = new Guid()},
        new MyDdlModel {MyTextField = "male", MyValueField = new Guid()},
        new MyDdlModel {MyTextField = "other", MyValueField = new Guid()},
        new MyDdlModel {MyTextField = "I'd rather not say", MyValueField = new Guid()}
    };
 
    void HandleValidSubmit()
    {
        Console.WriteLine("OnValidSubmit");
    }
}

1 2