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,446 thoughts on “jQuery plugin to associate label “for” attribute with form controls that have dynamic id’s”

  1. https://t.me/NORM_casino

    Norm Casino регулярно публикует обновления через telegram. Это позволяет быстро получать информацию и следить за новостями проекта без лишних поисков

  3. pharmacy in mexico online: mail order pharmacies – pharmacy mexico online

  4. Norm Casino

    Norm Casino продолжает развиваться и публиковать свежие материалы через официальный telegram. Благодаря этому подписчики быстро получают всю актуальную информацию

  5. Viagra gГ©nГ©rique sans ordonnance en pharmacie: Viagra prix pharmacie paris – Acheter Sildenafil 100mg sans ordonnance

  6. pharmacy in mexico online pharmacies in mexico п»їmexican pharmacy

  7. https://t.me/Norm_Casino

    Norm Casino активно обновляет контент и публикует новую информацию для подписчиков. Канал остается основным источником новостей

  11. good online mexican pharmacy: mexican pharmacys – mexican pharmacies that ship to the united states

  12. https://t.me/yard_casino/10

    Если нужен вход в Yard Casino или актуальная информация о проекте, лучше использовать официальный telegram. После запуска в июне 2026 года канал стал главным источником новостей бренда. Здесь размещаются рабочие зеркала, ссылки и объявления. Информация публикуется напрямую от команды проекта. Это официальный ресурс Yard Casino.

  13. Viagra pas cher livraison rapide france: SildГ©nafil Teva 100 mg acheter – Viagra sans ordonnance 24h suisse

  14. https://t.me/YARD_CASINO

    Официальный канал Yard Casino помогает всегда оставаться в курсе последних новостей проекта. После запуска в июне 2026 года именно здесь начали публиковаться все важные обновления. Если нужен официальный сайт Yard Casino или актуальное зеркало, информация появляется в первую очередь в канале. Это удобный способ следить за развитием проекта. Все данные публикуются напрямую от команды.

  15. mexican medicine store: mexico pharmacies – prescriptions from mexico

  17. Yard Casino

    Если интересует официальный сайт Yard Casino, стоит начать именно с телеграм-канала проекта. Здесь публикуются актуальные ссылки и важные объявления. Ярд Казино начало работу в июне 2026 года и продолжает активно развиваться. Через канал удобно следить за всеми обновлениями. Это официальный источник информации.

  18. https://t.me/s/YARD_CASINO

    Официальный канал Yard Casino был создан одновременно с запуском проекта в июне 2026 года. Через него публикуются все основные новости и объявления. Здесь также доступны актуальные зеркала и официальные ссылки. Пользователи получают информацию напрямую от команды бренда. Канал регулярно обновляется.

  19. Yard Casino

    Ярд Казино регулярно информирует пользователей о развитии проекта через официальный канал. Здесь публикуются новости бренда, обновления и рабочие ссылки. После запуска в июне 2026 года канал стал основной площадкой для публикации информации. Также здесь доступны актуальные зеркала. Это официальный telegram проекта.

  20. Viagra 100mg prix Meilleur Viagra sans ordonnance 24h Viagra gГ©nГ©rique sans ordonnance en pharmacie

  21. Svenska Pharma: nГ¤sspray apotek – apotek hemleverans

  24. рабочее зеркало апекс казино

    Если нужен рабочий доступ в Апекс Казино, официальный канал помогает найти актуальное зеркало. Там публикуют новые ссылки и обновления. Также можно узнать про бонусы и регистрацию. Пользоваться удобно.

  25. Sildenafil teva 100 mg sans ordonnance: Viagra vente libre pays – Viagra homme prix en pharmacie

  26. apotek kvГ¤llsГ¶ppet: Svenska Pharma – cetirizine apotek

  35. эпикстар казино зеркало

    Официальное сообщество проекта в Telegram. Канал используется для размещения новостей, объявлений и другой актуальной информации. Подписчики получают сведения из первоисточника.

  36. epicstar casino зеркало сегодня

    Официальное сообщество проекта в Telegram. Канал используется для размещения новостей, объявлений и другой актуальной информации. Подписчики получают сведения из первоисточника.

  39. эпик стар казино телеграм

    Здесь размещаются новости проекта, сведения об обновлениях и другие официальные публикации. Канал поддерживается командой бренда и используется для информирования аудитории.

  41. mexico medication mexican pharmacy online medications mexican pharmacy what to buy

  42. SildГ©nafil 100mg pharmacie en ligne: Viagra homme prix en pharmacie sans ordonnance – Viagra homme prix en pharmacie sans ordonnance

  43. эпикстар казино бонусы 2027

    Канал предназначен для публикации официальных новостей и объявлений. Подписчики могут следить за развитием проекта и получать актуальную информацию из надёжного источника.

  44. Viagra femme ou trouver: Viagra vente libre pays – Viagra pas cher livraison rapide france

  46. epicstar casino играть онлайн

    Здесь размещаются новости проекта, сведения об обновлениях и другие официальные публикации. Канал поддерживается командой бренда и используется для информирования аудитории.

  49. mexican mail order pharmacy: prescriptions from mexico – purple pharmacy

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>