フォーム内のリピーターフィールドの数をライブで表示する

フォームに追加されたリピーターフィールドの行数をライブで表示したいですか?これは、特に名前、タスク、商品アイテムを追加するようなシナリオで、ユーザーが入力したアイテムの数を確認したい場合に便利です。

このチュートリアルでは、シンプルなPHPスニペットを使って、"Count "フィールドをリアルタイムで自動的に更新する方法を説明します。

注意: このチュートリアルではPHPとJavaScriptの両方を追加します。あなたのサイトにスニペットを追加する手助けが必要な場合は、WPFormsのカスタムコードを追加するガイドをご覧ください。

フォームの作成

始めに、フォームを作成し、リピータ・フィールドと、「カウント」などのラベルが付いた1行テキスト・フィールドを含めます。このフィールドは自動的に更新されるので、ユーザーが手動で入力する必要はありません。

フォームの作成にヘルプが必要な場合は、最初のフォーム作成のチュートリアルをご覧ください。

以下のスニペットを使用して、フォームでライブカウント機能を有効にします。

スニペット内の以下のIDを自分のフォームに合わせて更新する必要があります：

wpforms-5410-field_1-container:交換 5410 実際の フォームID そして field_1 あなたの リピーター・フィールドID.
wpforms-5410-field_3:交換 field_3 あなたの カウントフィールドID.

フォームとフィールドのIDを見つけるには、こちらのチュートリアルをご覧ください。

このスニペットが追加され、IDが更新されると、ユーザがリピータに行を追加したり削除したりすると、Countフィールドが自動的に更新されます。

これで完了です！これで、リピーターフィールドにダイナミックカウンターが追加されました。