チェックボックスフィールド

チェックボックスフィールドでは、チェックボックスのグループが提供されます。

設定

チェックボックスの設定は、次の通りです。

  • チェックボックスのオプション – フィールドで利用可能なチェックボックスを定義します。オプションの値とラベルを別々に設定したり、デフォルトでチェックしておくものを選択できます。

テンプレート記法

チェックボックスフィールドによるエレメントの照会

チェックボックスフィールドを持つエレメントを照会する場合、フィールドのハンドルにちなんで名付けられたクエリパラメータを使用して、チェックボックスフィールドのデータに基づいた結果をフィルタできます。

利用可能な値には、次のものが含まれます。

取得するエレメント
'*"foo"*'foo オプションが選択されている。
'not *"foo"*'foo オプションが選択されていない。
{# Fetch entries with the 'foo' option checked #}
{% set entries = craft.entries()
    .<FieldHandle>('*"foo"*')
    .all() %}

チェックボックスフィールドデータの操作

テンプレート内でチェックボックスフィールドのエレメントを取得する場合、チェックボックスフィールドのハンドルを利用して、そのデータにアクセスできます。

{% set value = entry.<FieldHandle> %}

それは、フィールドデータを含む craft\fields\data\MultiOptionsFieldData オブジェクトを提供します。

選択されたオプションすべてをループするには、フィールド値を反復してください。

{% for option in entry.<FieldHandle> %}
    Label: {{ option.label }}
    Value: {{ option }} or {{ option.value }}
{% endfor %}

利用可能なオプションすべてをループするには、options プロパティを反復してください。

{% for option in entry.<FieldHandle>.options %}
    Label:   {{ option.label }}
    Value:   {{ option }} or {{ option.value }}
    Checked: {{ option.selected ? 'Yes' : 'No' }}
{% endfor %}

いずれかのチェックボックスが選択されているかを確認するには、length フィルタを使用してください。

{% if entry.<FieldHandle>|length %}

特定のオプションが選択されているかを確認するには、contains() を使用してください。

{% if entry.<FieldHandle>.contains('foo') %}

投稿フォームでチェックボックスフィールドを保存

チェックボックスフィールドを含める必要がある投稿フォームがある場合、出発点としてこのテンプレートを使用してください。

{% set field = craft.app.fields.getFieldByHandle('<FieldHandle>') %}

{# Include a hidden input first so Craft knows to update the
   existing value, if no checkboxes are checked. #}
{{ hiddenInput('fields[<FieldHandle>]', '') }}

<ul>
    {% for option in field.options %}

        {% set checked = entry is defined
            ? entry.<FieldHandle>.contains(option.value)
            : option.default %}

        <li><label>
            <input type="checkbox"
                name="fields[<FieldHandle>][]"
                value="{{ option.value }}"
                {% if checked %}checked{% endif %}>
            {{ option.label }}
        </label></li>
    {% endfor %}
</ul>