使い方

$("foo").MTAppDynamicSelect({
    dynamic: true,
    text: '',
    addText: '項目を追加する',
    promptMsg: '追加する項目名を入力',
    initGroupName: '選択中アイテム',
    selected: null,
    debug: false
});

fooには、ドロップダウンリストに変更したい input:text または textarea のセレクタを設定します。オプションの設定は下記の通りです。

オプション

text（Type : String, Default : ''）

ドロップダウンリストの項目を、カンマ区切りの文字列か、連想配列と配列の入れ子で設定します。

カンマ区切りで１語ずつ指定した場合は、指定した内容がそのまま option 要素の項目と value 属性の値となります。

$('#customfield_mtappdynamicselect').MTAppDynamicSelect({
  text: 'サッカー,テニス,野球'
});

カンマ区切りで「foo|bar」のようにパイプで区切った値を指定した場合は、foo が option 要素の value 属性の値となり、bar が option 要素の内容となります。

$('#customfield_mtappdynamicselect').MTAppDynamicSelect({
  text: 'soccer|サッカー,tennis|テニス,baseball|野球'
});

また、text オプションに連想配列と配列の入れ子を設定することで、オプショングループに対応したドロップダウンリストを作ることができます。

$('#customfield_mtappdynamicselect').MTAppDynamicSelect({
  text: {
    '関東':['茨城県', '栃木県', '群馬県', '埼玉県', '千葉県', '東京都', '神奈川県'],
    '近畿':['三重県', '滋賀県', '京都府', '大阪府', '兵庫県', '奈良県', '和歌山県']
  }
});

さらに、連想配列の中の配列には、前述した「foo|bar」の書式も設定することが出来ます。

$('#customfield_mtappdynamicselect').MTAppDynamicSelect({
  text: {
    '関東':[
      'ibaraki|茨城県',
      'tochigi|栃木県',
      'gunma|群馬県',
      'saitama|埼玉県',
      'chiba|千葉県',
      'tokyo|東京都',
      'kanagawa|神奈川県'
    ],
    '近畿':[
      'mie|三重県',
      'shiga|滋賀県',
      'kyoto|京都府',
      'osaka|大阪府',
      'hyogo|兵庫県',
      'nara|奈良県',
      'wakayama|和歌山県'
    ]
  }
});

dynamic（Type : Boolean, Default : true）

MTAppDynamicSelect で生成されるドロップダウンリストは、ユーザーが項目を自由に増やすことができます。dynamic オプションに false を設定すると、ユーザーが追加できる機能を無効にできます。

なお、このユーザーが増やした値は、その値が選択され保存された場合は次回もそのフィールドに表示されますが、新規の記事やコンテンツデータなど、値が保存されていないフィールドには表示されません。

また、追加する項目には「foo|bar」の書式は利用できません。

addText（Type : String, Default : '項目を追加する'）

ユーザーが項目を追加するときの項目名を変更できます。

$('#customfield_mtappdynamicselect').MTAppDynamicSelect({
  text: 'サッカー,テニス,野球',
  addText: 'リストを拡張'
});

promptMsg（Type : String, Default : '追加する項目名を入力'）

ユーザーが項目を追加する際のプロンプトのメッセージを変更できます。

$('#customfield_mtappdynamicselect').MTAppDynamicSelect({
  text: 'サッカー,テニス,野球',
  addText: 'リストを拡張',
  promptMsg: 'リスト名を入力してください'
});

initGroupName（Type : String, Default : '選択中アイテム'）

text オプションで連想配列と配列の入れ子を設定した場合（オプショングループに対応させた場合）、ユーザーが追加した項目など、設定された項目以外の項目が選択されているときに表示されるオプショングループのテキストを変更できます。

$('#customfield_mtappdynamicselect').MTAppDynamicSelect({
  text: {
    '関東':['茨城県', '栃木県', '群馬県', '埼玉県', '千葉県', '東京都', '神奈川県'],
    '近畿':['三重県', '滋賀県', '京都府', '大阪府', '兵庫県', '奈良県', '和歌山県']
  },
  initGroupName: '既定項目以外を選択中'
});

selected（Type : Boolean, Default : false） null

ドロップダウンリストが選択されたときに呼ばれる関数を設定できます。この関数には、ドロップダウンリストの値（選択された option の値）が渡されます。

例えば、選択された値をタイトル欄にも自動で入力する場合は、次のようなコードになります。

$('#customfield_mtappdynamicselect').MTAppDynamicSelect({
  text: {
    '関東':['茨城県', '栃木県', '群馬県', '埼玉県', '千葉県', '東京都', '神奈川県'],
    '近畿':['三重県', '滋賀県', '京都府', '大阪府', '兵庫県', '奈良県', '和歌山県']
  },
  selected: function(v){
    $('#title').val(v);
  }
});

debug（Type : Boolean, Default : false）

true を設定するとセレクタで指定した元のフィールドを表示されます。開発中にどのような値が元のフィールドに保存されるのかを確認できます。

初期値は false です。

$('#customfield_mtappdynamicselect').MTAppDynamicSelect({
  debug: true
});