Quantcast
Channel: Active questions tagged blazor - Stack Overflow
Viewing all articles
Browse latest Browse all 4839

Blazor Radio Button with checked and aria-describedby

$
0
0

I'm writing a Blazor application (server side, .NET 8.0), that has radio buttons. I am using the generic <input> HTML instead of a .NET component. This is a standard "loop through all the answers and mark the one that is selected".

      @foreach (var answer in Component.Answers.Where(a => !a.NotObserved || ShowNotObserved).Select((value, i) => new { i, value }))      {<div class="first first-@answer.value.NumberColumns first-mobilerow-@answer.i"><input type="radio" value="@answer.value.QuantitativeAnswer" checked="@(ComponentAnswer == null ? false : answer.value.QuantitativeAnswer == ComponentAnswer.QuantitativeScore)" disabled="@(IsReadOnly && !(ComponentAnswer == null ? false : answer.value.QuantitativeAnswer == ComponentAnswer.QuantitativeScore))" name="@Component.Code" id="@Component.Code-@answer.value.QuantitativeAnswer" aria-describedby="description-@Component.Code-@answer.value.QuantitativeAnswer" @onchange="e => SaveAnswer(answer.value.QuantitativeAnswer, answer.value.QualitativeAnswer, answer.value.Description)" /><div id="description-@Component.Code-@answer.value.QuantitativeAnswer" style="display: none;">@answer.value.Description</div><label for="@Component.Code-@answer.value.QuantitativeAnswer">@answer.value.Answer(ShowQuantitativeAnswer)</label></div>      }

This seems very cargo cult programming, but when I move the checked attribute after the aria-describedby attribute, sometimes none of the radio buttons are selected (even if I add a statement confirming that the statement is true: answer.value.QuantitativeAnswer == ComponentAnswer.QuantitativeScore). This doesn't happen all the time but enough that I can repeat the issue.

Is there something that could short-circuit the checked attribute? Order of the attributes shouldn't matter, correct? Thanks!


Viewing all articles
Browse latest Browse all 4839

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>