実際の値は、選択できる項目が１つの場合はその値が、複数の場合はカンマ区切りで元のフィールドに保存されます。

使い方

$("foo").MTAppMultiForm({
    type: '',
    items: [],
    styles: 'height: auto;',
    debug: false
});

foo には、変更したい input:text または textarea のセレクタを設定します。
type と items は必須です。

オプション

type（Type : String, Default : ''）

変更したいフォームのタイプを指定します。指定できるタイプは以下の４つです。

• 'checkbox' : チェックボックス
• 'radio' : ラジオボタン
• 'select' : ドロップダウンリスト
• 'select.multiple' : 複数選択セレクトボックス

チェックボックスのサンプルコード

$('#customfield_mtappmultiform').MTAppMultiForm({
  type: 'checkbox',
  items: ['サッカー','フットサル','テニス','格闘技']
});

ラジオボタンのサンプルコード

$('#customfield_mtappmultiform').MTAppMultiForm({
  type: 'radio',
  items: ['サッカー','フットサル','テニス','格闘技']
});

ドロップダウンリストのサンプルコード

$('#customfield_mtappmultiform').MTAppMultiForm({
  type: 'select',
  items: ['サッカー','フットサル','テニス','格闘技']
});

複数選択セレクトボックスのサンプルコード

$('#customfield_mtappmultiform').MTAppMultiForm({
  type: 'select.multiple',
  items: ['サッカー','フットサル','テニス','格闘技']
});

items（Type : Array, Default : []）

項目を配列で設定します。ここで設定した項目がラベルや保存される値となります。

なお、項目名にはカンマや半角スペースは使用しないでください。

$('#customfield_mtappmultiform').MTAppMultiForm({
  type: 'select.multiple',
  items: ['サッカー','フットサル','テニス','格闘技']
});

出力後の HTML は次のようになります。

<select multiple="multiple" style="height: auto;">
  <option value="サッカー" >サッカー</option>
  <option value="フットサル">フットサル</option>
  <option value="テニス">テニス</option>
  <option value="格闘技">格闘技</option>
</select>

styles（Type : String, Default : 'height: auto;'）

type オプションに 'select.multiple' を設定したときのみ有効になります。主に複数選択セレクトボックスの高さを調整するのに使います。

debug（Type : Boolean, Default : false）

true を設定すると元のフィールドが表示されます。開発中に保存されている値を確認できます。