LoginSignup
0
0

More than 5 years have passed since last update.

OctoberCMSプラグイン作成:バックエンドのドロップダウンにデフォルト値を含める方法3つ

Posted at

概要

バックエンドのフォームのドロップダウンにハードコードした選択肢ではなく、DBに入れたデータを使用する場合に、デフォルト値を設定する方法のメモ。

フォームにドロップダウンを表示するには、モデルにリレーションを定義するか、ドロップダウンコントロールを使う方法があるが、いずれも意図的にデフォルト値を入れてやらないと、未選択の状態でも選択肢のどれかが勝手に選択された状態になってしまう。

未選択の状態であることをデータ(0やnullなど)として入れるためには、未選択の状態がドロップダウンに表示されるようにする必要があるが、次の3つの方法が考えられる。

  1. 選択肢にデフォルト値が含まれるようにデータを用意する
  2. フィールド定義で placeholder を設定する
  3. オプション取得メソッドで意図的にデフォルト値を入れる

TL;TR

結論から言うと3番目の方法が一番良い。

1. 選択肢にデフォルト値が含まれるようにデータを用意する

リレーションかドロップダウンコントロールのいずれを使うにしても、選択肢となる元データにデフォルト値を含める方法。

下記のようなリレーションを使用してドロップダウンを表示する場合、AnimalCategoryのはじめにデフォルト値を登録しておくことで実現できる。ただ、これはデータが既に入っている場合に対応できないなど柔軟性に欠け、あまりスマートな方法ではない。

class Animal extends Model
{
    public $belongsTo = [
        'category' => ['Pikanji\Zoo\Models\AnimalCategory'],
    ];
    ...
}
class Animal extends Model
{
    public function getAnimalCategoryOptions()
    {
        return AnimalCategory::all()->pluck('display_name', 'id');
    }
    ...
}

2. フィールド定義で placeholder を設定する

こちらは、フィールドにdorpdownタイプを使用する場合。
フィールド定義ファイルmodels\animal\fields.yamlで下記のようにplaceholderを指定することで実現できる。

fields:
    animalCategory:
        label: Animal Category
        span: auto
        type: dropdown
        placeholder: '-- 選択してください --'

設定だけで実現できるのできれいだが、一度選択肢たら未選択の状態に戻せないという欠点がある。

3. オプション取得メソッドで意図的にデフォルト値を入れる

こちらもフィールドにdorpdownタイプを使用する方法だが、上記いずれの方法の問題点を克服している。

2で紹介したplaceholderは使用せずに、オプション取得メソッドで選択肢配列の一番前に未選択状態の選択肢を突っ込んでやる。(下記の例ではselect optionのvalueは選択肢データのidカラムを使用している前提。)

class Animal extends Model
{
    public function getAnimalCategoryOptions()
    {
        $options = AnimalCategory::all()->pluck('display_name', 'id');
        $options->prepend('-- 選択してください --', 0);
        return $options;
    }
    ...
}

特殊なことをしていない限りDBのデータは1から始まるので、keyを0で配列(またはCollection)の先頭に未選択状態の選択肢を挿入してやる。

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0