June 21, 2021: Fixed an issue where List field icons were not hidden.
June 3, 2021: Updated snippet documentation to reflect GF 2.5 changes and fixed an issue where rows were not counted correctly.
March 31, 2021: Migrated snippet to the Snippet Library.
July 27, 2020: Fixed issue where script could be run before jQuery was loaded.
April 25, 2020: Added compatibility for the GravityView Edit Entry screen.
August 22, 2019: Fixed intermittent issue where loading script in Gravity Forms Gutenberg block caused Parent Selector to disappear.
October 5, 2013: Updated snippet to use a class format for easier instantiation which also adds support for applying to multiple forms and multiple fields on the same form.
January 26, 2013: Updated to better select the current list field table rows.
Stop! There's a better way.
This snippet is available as a plugin with Gravity Perks, a suite of over 47 premium Gravity Forms plugins!
Found this interesting question on the Gravity Forms forum:
I’m selling tickets. So each ticket needs to be associated with a name/email/etc…
Basically, the user needs a way to gather a set of data per ordered product/ticket. My first instinct was to simply recommend using the List field. The user could specify the number of tickets and then add/remove however many rows they need.
I kept thinking on it and realized it would be really nice if the number of List field rows increased/decreased automatically based on the number of selected tickets. Here’s a snippet to do just that!
How do I install this snippet?
Just copy and paste the snippet above into your theme’s functions.php file.
Do I need to modify this snippet to work with my form?
You just need to create your own instance of the GWAutoListFieldRows
class. You’ll find two examples at the bottom of the snippet. Comment them out and then add your own! All you need to set is the $form_id
, the $list_field_id
, and the HTML id of your input as the $input_html_id
property.
Did this resource help you do something awesome with Gravity Forms?
Then you'll absolutely love Gravity Perks; a suite of 47+ essential add-ons for Gravity Forms with support you can count on.
By removing the +/- button at the end of the list row(s), flex resizes the input boxes to fill the entire width. But the labels stay in their original spot and end up hanging off the left side of the input. It looks terrible. I have screenshots I can email to you.
https://chordsmen.org/2022-spring-show-back-in-business/#tickets
The Name/Email list is linked to the ticket Quantity field. The Email label is misaligned.
This is at the end of the column label row and needs to be deleted to align the labels and inputs.
I didn’t see a Reply link so I entered a new “Reply” (yes, I was mislead by the name of your Comment form).
I tried to paste HTM – div element – but when I submitted the comment, it wasn’t there. So I’m putting it in double quotes and hoping that makes a difference.
This is at the end of the column label row and needs to be deleted to align the labels and inputs. “
“
This is inside its own div. class=”gfield_header_item gfield_header_item–icons”>
div class=”gfield_header_item gfield_header_item–icons”>& nbsp; /div
I take it you can’t post HTML in these comments? I’m trying to trick it.
Hi John,
As you may have seen on the documentation, there is a better way to get this functionality in our GP Auto List Field Perk. Snippet support is also only available to active Gravity Perks license holders and even with that instead of using this snippet, we would recommend using our GP Auto List Field Perk.
Best,
I fixed it. $(“#field_{0}_{1} .gfield_header_item–icons”.format(this.formId, this.listFieldId)).css(‘display’, ‘none’);
Thanks for sharing John!
But Samuel, you still provide the fee snippets, for which I am grateful. And this is a bug. Don’t you want to fix bugs in both the free and paid versions?
It’s not “support”. I’m helping you out by reporting a bug. I would hope you’d fix a bug in anything you produce for the public.