jQuery plugin to associate label “for” attribute with form controls that have dynamic id’s

Posted on by

For whatever reason, you can’t associate your labels with your form controls implicitly by wrapping both the label text and the control in a <label> element:

<label>
  Email address: <input type="email" name="email" value="" placeholder="you@example.com"/>
</label>

You’ve had to explicitly state the form control you want the label to be associated with:

<label for="email">Email address:</label>
<input id="email" type="email" name="email" value="" placeholder="you@example.com"/>

…but your framework has other ideas, it decides to commandeer your precious “id” attribute and change it from a simple and beautiful “email” into a junky “dnn_ctr1163_RegistrationForm_email”. *cough* DotNetNuke *cough*, but also *cough* Wicket *cough* and probably a whole load of others.

The problem is now that your label is no longer associated with your form control, and there isn’t a simple fix, like, for example, change the for attribute to read “dnn_ctr1163_RegistrationForm_email”, because the numbers in the id change each time you refresh the page. The ID is dynamic, and you are receiving accessibility black stars.

So, luckily I noticed that often the id will change, but the framework will leave your originally intended id somewhere in there. I’ve written a jQuery plugin to look at label for attributes and try to find the form control you intended to associate it with before your server side framework so rudely changed it.

How to use

  1. Download the plugin and add it to your page
  2. Select the labels you want to re-associate and call the function eg. $(‘label’).fuzzyFor();

TODO

The plugin finds matches by looking for input, select and textarea elements in the document and checking to see if the for attribute in your label element appears in the id attribute of the form control. At the moment if more than one match is found, it just uses the first (which is probably good enough for most). However, it should probably do something a bit more clever and use the form control that is closest to the label (I’m reasoning that you normally put your label’s close to your controls).

14,504 thoughts on “jQuery plugin to associate label “for” attribute with form controls that have dynamic id’s”

  2. Судебная защита Если вам срочно нужен юрист в Алматы, я готов оказать квалифицированную правовую помощь. Моя специализация включает в себя судебную защиту, комплексное сопровождение тендеров и представительство в суде по гражданским и экономическим делам. Доверьте решение юридических вопросов профессионалу.

  4. Правовая помощь Ищете надежного адвоката в Алматы для представительства в суде? Предлагаю профессиональные юридические услуги включая досудебное урегулирование конфликтов и сопровождение тендеров. Запишитесь на консультацию юриста и получите сильную правовую поддержку для защиты ваших интересов.

  5. тут

    Если нужен eva casino сайт без редиректов и ошибок, этот вариант можно сохранить. Я уже несколько раз заходил через него и проблем не заметил. Доступ стабильный и страницы загружаются быстро

  7. играть в казино

    Когда искал онлайн казино без блокировок, наткнулся на это зеркало Eva Casino. Решил протестировать и в итоге все открылось без проблем. Проверил вход, бонусы и регистрацию. Все функционирует нормально

  8. ева казино вход

    Если кто ищет eva casino сайт с нормальным доступом, этот вариант можно сохранить. Я тестировал его с телефона и ПК — работает стабильно везде. Вход и бонусные страницы открываются быстро

  9. Cheap generic Viagra UroHealth Daily – Generic Viagra for sale

  10. Viagra Tablet price generic sildenafil – sildenafil over the counter

  11. ссылка

    Искал играть в казино через рабочее зеркало Eva Casino после блокировки основного сайта. Этот вариант оказался рабочим и без лагов. Проверил бонусные страницы и регистрацию. Все функционирует нормально

  12. Sildenafil 100mg price UroHealth Daily – generic sildenafil

  14. там

    Когда понадобилось лицензированные казино с нормальным доступом, заодно проверял разные зеркала Eva Casino. Этот вариант оказался полностью рабочим. Вход и бонусы открываются быстро. Пока лучший вариант из тех, что нашел

  18. ева казино

    Недавно искал ева казино зеркало после того как старый домен перестал открываться. Этот вариант оказался одним из немногих рабочих. Все страницы загружаются быстро и без ошибок. Пока использую именно его

  19. sildenafil online cheap viagra Viagra tablet online

  20. viagra without prescription UroHealth Daily – sildenafil online

  21. Viagra generic over the counter Viagra tablet online – Sildenafil 100mg price

  22. Viagra online price UroHealth Daily – Cheap Sildenafil 100mg

  23. Viagra generic over the counter Viagra tablet online – Buy Viagra online cheap

  24. Buy Viagra online cheap UroHealth Daily – Buy generic 100mg Viagra online

  25. 1С поддерживает ЕГАИС и маркировку «Честный знак» автоматически обмениваясь данными с государственными системами. Перейти в каталог 1С для пиццерии управляет доставкой списанием теста и топпингов а также принимает заказы через мобильное приложение. Перейти к заказу 1С для кофейни управляет обжаркой зёрен и фасовкой автоматически списывая ароматизаторы и сиропы по рецептурам.Перейти на главную

  27. Sildenafil 100mg price order viagra – order viagra

  28. order viagra UroHealth Daily – Cheap Sildenafil 100mg

  29. Авиатуры из Владивостока во Вьетнам прямые рейсы Авиатуры из Владивостока во Вьетнам прямые рейсы

  34. Viagra online price UroHealth Daily – Generic Viagra online

  40. cheapest viagra UroHealth Daily – Cheap generic Viagra

  41. generic sildenafil Generic Viagra online Viagra Tablet price

  45. девушки Луганск ТГ Знакомства Луганск ТГ

  47. Cheap Cialis п»їcialis generic – buy cialis pill

  49. Синтол купить Если вы ищете возможность купить Синтол для достижения наилучших результатов в наращивании мышечной массы, вы сделали правильный выбор, ведь Synthol – это проверенное решение для амбициозных атлетов. Синтол – это нечто большее, чем просто добавка; это тщательно разработанная формула, призванная стимулировать рост мышечной ткани, придавая телу желаемую рельефность и массивность. Его уникальный состав действует синергично, ускоряя процессы восстановления и обеспечивая стойкий, видимый результат. Когда вы решаете купить Синтол, вы инвестируете в свое будущее, в свое тело, которое будет отражать вашу целеустремленность и страсть к совершенству. Этот препарат открывает новые горизонты для бодибилдеров и спортсменов, стремящихся к выдающимся достижениям. Синтол для мышц – это не миф, а реальность, доступная каждому, кто готов приложить усилия и выбрать правильный инструмент для достижения цели. Его применение позволяет не только увеличить объем, но и улучшить качество мускулатуры, делая ее более плотной и прочной. Synthol – это имя, которое ассоциируется с прогрессом и успехом в мире фитнеса. Его популярность среди профессионалов и любителей говорит само за себя: это средство, которое действительно работает, помогая превзойти собственные ожидания и достичь новых вершин в формировании идеального тела.

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>