Skip to main content
P
pennpix
Level 2
April 4, 2019
Question

No label tag for fields

  • April 4, 2019
  • 1 reply
  • 2322 views

Hi,

I wonder why there's no label tag for every field ?

It goes against W3C rules and specifically accessibility needs.

We'd like to wrap fields with a <label> tag which contain some properties like "for" and "aria-label".

Thanks a lot for any help.

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.

1 reply

Jay_Jiang
Jay_Jiang
Level 10
April 4, 2019

Some jQuery to add attribute to existing label 

MktoForms2.whenReady(function (form) {
    var $formEl = form.getFormElem(),
    $inputs = $formEl.eq(0).find(':input');
    $.each($inputs, function(){
        $(this).parent().find('label').eq(0).attr("aria-label",$(this).attr("id"));
    });
});

Or specifically wrapping the input with a new label:

MktoForms2.whenReady(function (form) {
    var $formEl = form.getFormElem(),
        $inputs = $formEl.eq(0).find(':input');
$.each($inputs, function(){
$(this).wrap('<label/>').parent().attr({"for":$(this).attr("id"),"aria-label":$(this).attr("id")});
});
});
SanfordWhiteman
SanfordWhiteman
Level 10
April 4, 2019

Use MktoForms.$, not simply $, if you must depend on additional jQuery methods. Then you won't be requiring the person to include a separate framework.

Jay_Jiang
Jay_Jiang
Level 10
April 4, 2019
MktoForms2.whenReady(function (form) {  
    var $formEl = form.getFormElem(),  
    $inputs = $formEl.eq(0).find(':input');  
    MktoForms2.$.each($inputs, function(){  
        MktoForms2.$(this).wrap('<label/>').parent().attr({"for":MktoForms2.$(this).attr("id"),"aria-label":MktoForms2.$(this).attr("id")});  
    });  
});
Terms & ConditionsAccessibility statement

Loading footer...