Skip to content

gpadvs-dropdown-remove-button.js: Added snippet to show remove button on Dropdown fields. #1028

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 5 commits into from
Mar 21, 2025
Merged

gpadvs-dropdown-remove-button.js: Added snippet to show remove button on Dropdown fields. #1028

Show file tree
Hide file tree
Changes from 4 commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
ef7aba0
`gpadvs-dropdown-remove-button.js`: Added snippet to show remove butt…
veryspry Feb 27, 2025
0de9613
`gpadvs-dropdown-remove-button.js`: Added Tom Select remove button pl…
veryspry Feb 28, 2025
793d79e
`gpadvs-dropdown-remove-button.js`: Added snippet to show "Clear" but…
veryspry Feb 28, 2025
8752ed8
`gpadvs-dropdown-remove-button.js`: Added conditional showing how to …
veryspry Mar 18, 2025
148b7c5
`gpadvs-dropdown-remove-button.js`: Updated documentation comment.
veryspry Mar 20, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
31 changes: 31 additions & 0 deletions gp-advanced-select/gpadvs-clear-button.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,31 @@
/**
* Gravity Perks // Advanced Select // Clear Button
* https://gravitywiz.com/documentation/gravity-forms-advanced-select/
*
* Adds a Clear buton to GP Advanced Select fields.
*
* The Clear Button is a built in plugin of Tom Select.
* @reference https://tom-select.js.org/plugins/clear-button/
*
* Instructions:
*
* 1. Install this snippet with our free Custom JavaScript plugin.
* https://gravitywiz.com/gravity-forms-code-chest/
*/
window.gform.addFilter(
'gpadvs_settings',
function(settings, gpadvsInstance, selectNamespace) {
/**
* Scope to only dropdown fields.
* This can also be changed to 'multiselect' to only target multi-select fields
* OR the conditional can be removed to apply to all fields.
*/
if (gpadvsInstance.fieldType === 'dropdown') {
settings.plugins.clear_button = {
title: 'Clear options',
};
}

return settings;
}
);
27 changes: 27 additions & 0 deletions gp-advanced-select/gpadvs-dropdown-remove-button.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
/**
* Gravity Perks // Advanced Select // Dropdown Remove Button
* https://gravitywiz.com/documentation/gravity-forms-advanced-select/
*
* Adds a Remove button to selection options in Dropdown fields. By default,
* the remove button is only added to Multi-Select fields.
*
Copy link

@coderabbitai coderabbitai bot Mar 18, 2025 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue

Documentation and implementation mismatch.

The documentation states this adds a Remove button to Dropdown fields and is only added to Multi-Select fields by default. However, the implementation applies to all field types without any conditional check (unlike the clear-button implementation).

Either update the documentation to match the implementation or add a conditional check similar to the clear-button implementation:

function(settings, gpadvsInstance, selectNamespace) {
+    /**
+     * Scope to only multi-select fields.
+     * This conditional can be modified to target different field types.
+     */
+    if (gpadvsInstance.fieldType === 'multiselect') {
        settings.plugins.remove_button = {
            title: window.GPADVS.strings?.remove_this_item
                ? window.GPADVS.strings.remove_this_item
                : 'Remove this item',
        }
+    }

    return settings;
}
📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change
* Adds a Remove button to selection options in Dropdown fields. By default,
* the remove button is only added to Multi-Select fields.
*
function(settings, gpadvsInstance, selectNamespace) {
/**
* Scope to only multi-select fields.
* This conditional can be modified to target different field types.
*/
if (gpadvsInstance.fieldType === 'multiselect') {
settings.plugins.remove_button = {
title: window.GPADVS.strings?.remove_this_item
? window.GPADVS.strings.remove_this_item
: 'Remove this item',
}
}
return settings;
}

Copy link
Contributor Author

@veryspry veryspry Mar 20, 2025 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nice one, code rabbit :finger-guns. Updated ✅

Copy link

@coderabbitai coderabbitai bot Mar 20, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@veryspry Thank you for implementing the suggested change! This will ensure the implementation aligns with the documentation and targets only multi-select fields as intended.

(\ /)
(･ᴗ･)
/ >🥕

* The Remove Button is a built in plugin of Tom Select.
* @reference https://tom-select.js.org/plugins/remove-button/
*
* Instructions:
*
* 1. Install this snippet with our free Custom JavaScript plugin.
* https://gravitywiz.com/gravity-forms-code-chest/
*/
window.gform.addFilter(
'gpadvs_settings',
function(settings, gpadvsInstance, selectNamespace) {
settings.plugins.remove_button = {
title: window.GPADVS.strings?.remove_this_item
? window.GPADVS.strings.remove_this_item
: 'Remove this item',
}

return settings;
}
);
Loading