2

I currently have a SharePoint 2013 farm that uses a custom master page. Within the master page, we are attempting include a label preceding the search box control without the use of JavaScript/jQuery. We are looking to meet Section 508 and WCAG 2.0 requirements for having labels tied to each input control and are stumped on this particular one.

Below is the code behind:

<SharePoint:AjaxDelta id="DeltaPlaceHolderSearchArea" BlockElement="true" CssClass="ms-mpSearchBox ms-floatRight" runat="server">

<asp:ContentPlaceHolder id="PlaceHolderSearchArea" runat="server">

<SearchWC:SearchBoxScriptWebPart UseSiteCollectionSettings="true" EmitStyleReference="false" ShowQuerySuggestions="true" ChromeType="None" UseSharedSettings="true" TryInplaceQuery="false" ServerInitialRender="true" runat="server" InitialPrompt=" " __WebPartId="{WPID}" />

</asp:ContentPlaceHolder>

</SharePoint:AjaxDelta>

I have attempted to add a label preceding this code, which targets the input id for the search textbox control. This did not work, though.

Has anyone attempted to do this? And, if so, how would I accomplish this?

Thank you.

  • I have added a span tag front of your highlighted code it is showing my label above search box. Mine is SPO site. – Venkat Konjeti Jun 15 '17 at 3:48
  • @VenkatKonjeti - Thank you for your reply. It's required I use the '<label>' tags to meet Section 508 and WCAG 2.0 compliance for input controls. When I use '<label for=WEBPARTID>', it does not appear that it is targeting the correct input tag that is generated by the '<SearchWC:SearchBoxScriptWebPart ...>'. – Jennifer Bartolome Jun 15 '17 at 14:50
  • WebPartID will change after rendered into HTML. You need to find out that. The search textbox format would be as ctl00_PlaceHolderSearchArea_SmallSearchInputBox1_csr_sbox – Venkat Konjeti Jun 15 '17 at 15:18
  • @VenkatKonjeti - Thank you for your reply. Yes, I used the ctl00_PlaceHolderSearchArea_g_InputBox1_csr_sbox. The label tag I used looked like this: <label for="ctl00_PlaceHolderSearchArea_g_InputBox1_csr_sbox">Search</label> prior to the code listed above and it did not satisfy the Section 508 and WCAG 2.0 guidelines. – Jennifer Bartolome Jun 15 '17 at 17:16

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.