add support for binding listeners to multiple forms #311

New issue

Closed

opened 2025-10-14 16:49:00 -06:00 by navan · 0 comments

navan commented

2025-10-14 16:49:00 -06:00

Owner

Originally created by @mckennapsean on 8/13/2017

Currently, the clientside JS attaches to just a single #gform element. When using two forms with that same ID (which, by the way, you should always have unique IDs for forms), then only one form works correctly #107.

One partial fix is to load the clientside JS manually into your own file, and add duplicate code for different IDs. This is less elegant and prone to errors. It does not allow someone to just refer to the GitHub JS code and get live updates for free.

Another solution is to allow the JS to attach listeners to any form that uses a class of "gform" or .gform instead. This would require a small rewrite to allow multiple listeners to be made, instead of just one. This would be fairly trivial to perform.

However, we probably don't want to break existing forms. This means we would want to have a selection of both #gform and .gform. This is because our tutorial advises people to load the current version of JS directly from GitHub's master version here.

This also has the potential to break other people's pages if they were using the class gform on any form fields and are pulling the code from the GitHub site.

Another option, we could provide a debug message / warning to people loading with #gform that it is deprecated, if we wanted to remove it in the future.

*Originally created by @mckennapsean on 8/13/2017* Currently, the clientside JS attaches to just a single `#gform` element. When using two forms with that same ID (which, by the way, you should always have unique IDs for forms), then only one form works correctly #107. One partial fix is to load the clientside JS manually into your own file, and add duplicate code for different IDs. This is less elegant and prone to errors. It does not allow someone to just refer to the GitHub JS code and get live updates for free. Another solution is to allow the JS to attach listeners to any form that uses a class of "gform" or `.gform` instead. This would require a small rewrite to allow multiple listeners to be made, instead of just one. This would be fairly trivial to perform. However, we probably don't want to break existing forms. This means we would want to have a selection of both `#gform` and `.gform`. This is because our tutorial advises people to load the current version of JS directly from GitHub's master version here. This also has the potential to break other people's pages if they were using the class `gform` on any form fields and are pulling the code from the GitHub site. Another option, we could provide a debug message / warning to people loading with `#gform` that it is deprecated, if we wanted to remove it in the future.