WebAIM - Web Accessibility In Mind

E-mail List Archives

Thread: indicating required field when using asp.net label control

for

Number of posts in this thread: 2 (In chronological order)

From: Angela French
Date: Wed, Nov 05 2008 11:40AM
Subject: indicating required field when using asp.net label control
No previous message | Next message →

Hello,

Can anyone tell me if putting the "required field" text between the
label and the form element presents any accessibility issues for screen
readers? IN other words, even though it is just after the label can
they still understand what is required?



This is the html:



<div class="row">

<label for="txtFirstName">First Name</label> (required
field):

<input name=" txtFirstName" type="text" maxlength="10" id="
txtFirstName" class="defaultinput" />

</div>



I ask this because styling the required field textf differently than the
label text is my goal. However, I'm using asp.net and the <asp:label>
control which uses the Text attribute to render the label text and there
is no way I know of to stick a span tag inside of the label control.
The asp code looks like this:



<div class="row">

<asp:label runat="server" AssociatedControlID="txtFirstName"
Text="First Name" ></asp:label> (required field)

<asp:TextBox ID="txtFirstName" CssClass="defaultinput" runat="server"
MaxLength="10"></asp:TextBox>

</div>



If I leave the (required field) inside the label tag, but not as part of
the Text attribute like this:

<asp:label runat="server" AssociatedControlID="txtFirstName"
Text="First Name">(required field)</asp:label>

It renders like this:

<label id="txtFirstName">(required field)</label> and never renders
the First Name text.



Any asp.net programmers out there that have a solution?









Angela French

Internet Specialist

State Board for Community & Technical Colleges

360-704-4316

http://www.checkoutacollege.com

http://www.sbctc.ctc.edu

From: Peter Krantz
Date: Wed, Nov 05 2008 12:25PM
Subject: Re: indicating required field when using asp.net label control
← Previous message | No next message

On Wed, Nov 5, 2008 at 7:39 PM, Angela French < = EMAIL ADDRESS REMOVED = > wrote:
> Hello,
>
> Can anyone tell me if putting the "required field" text between the
> label and the form element presents any accessibility issues for screen
> readers? IN other words, even though it is just after the label can
> they still understand what is required?

Since some assistive technology make use of the text in the label
element it is best if the "required" flag (however you are flagging
it) is inside the label. See:

http://www.webaim.org/techniques/formvalidation/

>
> <label id="txtFirstName">(required field)</label> and never renders
> the First Name text.
>

I remember that it was best not to use asp:label and instead go with
the generic elements like this:

<label for='<%= txtFirstName.ClientID %>'>Whatever...</label>

Regards,

Peter Krantz
http://www.standards-schmandards.com/