這個外掛並未在最新的 3 個 WordPress 主要版本上進行測試。開發者可能不再對這個外掛進行維護或提供技術支援,並可能會與更新版本的 WordPress 產生使用上的相容性問題。

Contact Form 7 – Repeatable Fields

描述

This plugin adds repeatable groups of fields to Contact Form 7.

NOTE: Tested with Contact Form 7 5.1.6.

Usage

Form tab

Wrap the desired fields with [field_group your_group_id_here][/field_group]. The shortcode accepts additional parameters, in WP shortcode format and in CF7 fields parameters format as well.

Example:

[field_group emails id="emails-groups" tabindex:1]
    <label>Your Email (required)[email* your-email]</label>
    [radio your-radio use_label_element default:1 "radio 1" "radio 2" "radio 3"]
    [select* your-menu include_blank "option1" "option 2"]
    [checkbox* your-checkbox "check 1" "check 2"]
[/field_group]

Mail tab

In the mail settings, wrap the fields with your group id. You can use the [group_index] tag to print the group index and an additional __<NUMBER> to print a field at a specific index.

Example:

The second email entered by the user was: [your-email__2]

These were the groups:
[emails]
GROUP #[group_index]
    Checkbox: [your-checkbox]
    E-mail: [your-email]
    Radio: [your-radio]
    Select: [your-menu]
[/emails]

Customizing the add and remove buttons

You can add filters to your theme to customize the add and remove buttons.

Example

// In your theme's functions.php
function customize_add_button_atts( $attributes ) {
  return array_merge( $attributes, array(
    'text' => 'Add Entry',
  ) );
}
add_filter( 'wpcf7_field_group_add_button_atts', 'customize_add_button_atts' );

The available filters are:

wpcf7_field_group_add_button_atts

Filters the add button attributes.

Parameters:
* $attributes: Array of attributes for the add button. Keys:
* additional_classes: css class(es) to add to the button
* text: text used for the button

Return value: array of button attributes

wpcf7_field_group_add_button

Filters the add button HTML.

Parameters:
* $html: Default add button HTML

Return value: button HTML

wpcf7_field_group_remove_button_atts

Filters the remove button attributes.

Parameters:
* $attributes: Array of attributes for the remove button. Keys:
* additional_classes: css class(es) to add to the button
* text: text used for the button

Return value: array of button attributes

wpcf7_field_group_remove_button

Filters the remove button HTML.

Parameters:
* $html: Default remove button HTML

Return value: button HTML

Contribute

You can contribute with code, issues and ideas at the GitHub repository.

If you like it, a review is appreciated 🙂

常見問題

Can I change the add/remove buttons?

Yes. You can use wpcf7_field_group_add_button_atts, wpcf7_field_group_add_button, wpcf7_field_group_remove_button_atts, and wpcf7_field_group_remove_button filters, as shown above. Props to @berniegp.

How can I display the group index number in the form?

You’ll have to use the wpcf7-field-groups/change jQuery event.

In the Form tab, add an element to hold the group index. In this example, it’ll be a <span> with the group-index class:

[field_group emails id="emails-groups" tabindex:1]
    <p>Group #<span class="group-index"></span></p>
    <label>Your Email (required)[email* your-email]</label>
    [radio your-radio use_label_element default:1 "radio 1" "radio 2" "radio 3"]
    [select* your-menu include_blank "option1" "option 2"]
    [checkbox* your-checkbox "check 1" "check 2"]
[/field_group]

And then you’ll have to add this to your JavaScript code:

jQuery( function( $ ) {
    $( '.wpcf7-field-groups' ).on( 'wpcf7-field-groups/change', function() {
        var $groups = $( this ).find( '.group-index' );
        $groups.each( function() {
            $( this ).text( $groups.index( this ) + 1 );
        } );
    } ).trigger( 'wpcf7-field-groups/change' );
} );

You can add that JS through your theme OR use some plugin like Simple Custom CSS and JS.

評價

2021年3月3日
Quick and easy way to add a simple repeater. Working fine for me on WP 5.6.2 and CF7 5.4. Thanks for making it available.
2020年11月11日
This plugin is unique. And it fine works with WP 5.5.
2020年8月18日
It's a little difficult to figure out but it works great. This is a really needed function for Contact Form 7 and I would hate to see it go. Noticed it isn't tested on the latest version of Wordpress. Would encourage the developer to carry on. This is a wonderful tool. Couldn't find anything better, anywhere.
2020年8月5日
Значение множественных полей не отдаются в $POST запросы. Эти поля потом невозможно получить для интеграции с другими системами Multiple field values are not given in $POST requests. These fields cannot then be obtained for integration with other systems.
閱讀全部17個評價

貢獻者及開發者

“Contact Form 7 – Repeatable Fields” 是一個開源的軟體。以下的人對這個外掛作出了貢獻。

貢獻者

Contact Form 7 – Repeatable Fields 外掛目前已有 4 個本地化語言版本。 感謝所有譯者為這個外掛做出的貢獻。

將 Contact Form 7 – Repeatable Fields 外掛本地化為台灣繁體中文版。

對開發相關資訊感興趣?

任何人均可瀏覽程式碼、查看 SVN 存放庫,或透過 RSS 訂閱開發記錄

修改日誌

To read the full list check our changelog.txt

1.1.3

  • Update WP Tested up to field
  • Apply WP Coding Standards
  • Fix a small sanitation problem

1.1.2

  • Fix Exclusive Checkboxes

1.1.1

  • Add compatibility to formatted dates ([_format_{field name} "{date format}"])
  • DEV: Copy data and events while cloning a new group (JS)
  • DEV: Pass $new_group as an extra param for the wpcf7-field-groups/added event.
  • DEV: Apply some WPCS rules and add a CF7_REPEATABLE_FIELDS_VERSION const (may affect JS cache)

1.1

  • Replace groups in mail 2 field