Checkboxes WCAG 2.0 AA Compliance

4 posts, 0 answers
  1. Egon Leitgeb
    Egon Leitgeb avatar
    4 posts
    Member since:
    Jan 2010

    Posted 15 Apr 2015 Link to this post

    I have a Treeview with Checkboxes enabled, here is aspx-Code:

    <telerik:RadTreeView ID="trVars" runat="server" CheckBoxes="True" OnClientNodeChecked="onNodeChecked" OnNodeDataBound="trVars_NodeDataBound" OnNodeClick="trVars_NodeClick" />

    Nodes are addes in server-side Code behind:

    trVars.DataFieldID = "ID";
    trVars.DataFieldParentID = "ParentID";
    trVars.DataTextField = "varLabel";
    trVars.DataValueField = "varName";
    trVars.DataSource = tbl;
    trVars.DataBind();

     For my application I need full compliance with the WCAG 2.0 AA standard. But the check did not pass because the checkboxes in the nodes need a label associated (Error Message in AC Checker: input element, type of "checkbox", has no text in label ...).

    Please help!

  2. Ivan Zhekov
    Admin
    Ivan Zhekov avatar
    540 posts

    Posted 20 Apr 2015 Link to this post

    Hello.

    The compliance check will be successful if:
    * there is a label with for attribute (with the proper value)
    * there is around the label and text

    (for reference http://achecker.ca/checker/suggestion.php?id=206)

    We use the latter approach for RadTreeView.

    Now, if the label itself does not have text, say the node is empty, that may cause the error. However, if the binding was successful and the tree looks normal and all nodes have text, then things should be OK.

    Regards,
    Ivan Zhekov
    Telerik
     

    See What's Next in App Development. Register for TelerikNEXT.

     
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Egon Leitgeb
    Egon Leitgeb avatar
    4 posts
    Member since:
    Jan 2010

    Posted 21 Apr 2015 in reply to Ivan Zhekov Link to this post

    Thanks for your answer! The TreeView works perfect without checkboxes. But with checkboxes set to true it generates HTML-Code like this

    <span class="rtSp"></span><label><input type="checkbox" class="rtChk" /><span class="rtIn">Sex</span></label>

    But for a successful check it should generate <label for="..."> ... </label> or something like this.

    Regards, Egon

  5. Ivan Zhekov
    Admin
    Ivan Zhekov avatar
    540 posts

    Posted 27 Apr 2015 Link to this post

    Hi, Egon.

    Usually you need either for attribute or label surrounding the input.

    We'll do some more accessibility tests and I will write back.

    Regards,
    Ivan Zhekov
    Telerik
     

    See What's Next in App Development. Register for TelerikNEXT.

     
Back to Top