1

Rails 3.2 で動的な選択フィールドを作成する必要があります。2 番目のフィールド (州) で使用できるオプションは、最初のフィールド (国) の値によって異なります。この Railscast の改訂版を参照し、次のコードを使用しています。

jQuery ->
  $('#person_state_id').parent().hide()
  states = $('#person_state_id').html()
  $('#person_country_id').change ->
    country = $('#person_country_id :selected').text()
    escaped_country = country.replace(/([ #;&,.+*~\':"!^$[\]()=>|\/@])/g, '\\$1')
    options = $(states).filter("optgroup[label='#{escaped_country}']").html()
    if options
      $('#person_state_id').html(options)
      $('#person_state_id').parent().show()
    else
      $('#person_state_id').empty()
      $('#person_state_id').parent().hide()

このコードに 2 つの変更を加える必要があります。これは、私よりも JavaScript のスキルが高い人にとってはかなり簡単なはずです。

  1. フィルタリングされたリストには、空白のオプションを含める必要があります。現在国を選択すると、filetred リストの最初の州が選択されます。「選択してください」というプロンプトを残す必要があります。これどうやってするの？

編集

SMathew の提案がここで役に立ちました。私は$('#person_state_id').html(options).prepend('<option></option>')、html タグのプロンプト属性と一緒に、必要な結果を達成するものを使用しています。

  1. 国が選択されていない場合 (つまりelseステートメント)person_state_idには、すべての州の完全なフィルター処理されていないリストが含まれている必要があります。私はもう試した：

    else $('#person_state_id').html(states)

しかし、これは期待どおりに動作していません。私はこれらの問題を抱えています。

  1. 州の記録が関連付けられている国を選択すると、#person_state_id オプションが正しくフィルター処理されます (また、smathews の提案により、プロンプトが含​​まれます)。

  2. 関連する州レコードがない国を選択すると、#person_state_id にはすべての州が含まれ、マークアップでは空白のオプションになりますが、デフォルトでは最初の州オプションが選択されます。(空白のオプションがデフォルトで選択され、プロンプトが表示された状態で、空である必要があります)。

  3. #person_country_id の選択をクリアすると、#person_state_id にはフィルター処理されていないすべての州のリスト (正しい) が含まれ、マークアップには空のオプションが含まれます (正しい) が、最初の州レコードがデフォルトで選択されます (プロンプトのはずです)。

これらの問題を解決するにはどうすればよいですか?

ありがとう

4

2 に答える 2

1

試す

...

if (options) {
  $('#person_state_id').html(options).prepend('<option>Please select</option>').parent().show()
} else {
   $('#person_state_id').html(states).prepend('<option>Please select a state</option>').parent().show()
}
于 2012-07-05T23:05:15.763 に答える
0

2番目の問題に対処するために、次のcoffeescriptを追加しました

jQuery ->
  resetCountry = ->
    $('#person_state_id').select2 "val", "0" 
  $('#person_country_id').bind("change", resetCountry);

これは、スマシューの答えと相まって、うまくいっているようです

(select2 を使用して選択フィールドをフォーマットしています。select2 を使用しない場合は、別の方法で値を設定する必要があります)

于 2012-07-07T06:06:39.610 に答える