How to add accessible name ( aria-label ) in @DropDownListFor in razor?

OneWorld 0

I have filter dropdown and trying to add comply with 508 compliance. I used aria_label, aria-label and aria_labelledby but unable to see accessible name for the DropDownListFor. I see No ARIA attributes under ARIA Attributes on Chrome Browse tool. How can I add accessible name for DropDownListFor (see snippet below) ?

<div class="col-md-3">
@Html.LabelFor(model => model.AccountID) <span style="color: red;">*</span>
@Html.DropDownListFor(m => m.AccountID, this.ViewBag.AccountList SelectList, new { id = "AccountList", multiple = "true" , @class = "selectSearchAccount show-tick form-control", aria_Label: "Select Account"})

AgaveJoe 26,141

Example

@Html.DropDownList("Design_ID", null, "Select Designation", htmlAttributes: new { @class = "form-control", @id = "select2-1", aria_label = "My aria label" })

OneWorld 0

I tried aria_label = "Select Account" but still "No ARIA attributes" under ARIA Attributes.

<div class="col-md-3">
@Html.LabelFor(model => model.AccountID) <span style="color: red;">*</span>

@Html.DropDownListFor(m => m.AccountID, this.ViewBag.AccountList SelectList, new { id = "AccountList", multiple = "true" , @class = "selectSearchAccount show-tick form-control", aria_Label = "Select Account"})
</div>

OneWorld 0 Reputation points

2024-03-18T21:05:06.86+00:00

I tried aria_Label = "Select Account" but still "No ARIA attributes" under ARIA Attributes on Chrome tool. I added htmlAttributes: as well.
JasonPan - MSFT 4,376 Reputation points Microsoft Vendor

2024-03-19T03:25:14.29+00:00
Hi @OneWorld,

Could you kindly check your Chrome version? Make sure you are using the latest version browser.

I test the DropDownList in asp.net and asp.net core, both of them are working properly as expected.

Here is the test result.

So the next action for you.

Upgrade your Visual Studio 2019/2022.

Upgrade your browser, you also can try to use Edge.

Best Regards

Jason
AgaveJoe 26,141 Reputation points

2024-03-19T09:45:07.5566667+00:00

I tried aria_Label = "Select Account" but still "No ARIA attributes" under ARIA Attributes on Chrome tool. I added htmlAttributes: as well.

The code example works perfectly on my end.