LiveView レンダリングで奇妙な問題が発生しました。流れとしては次のようになります。
- 最初の選択でデフォルト以外のオプションを選択し、2 番目の選択をデフォルトのままにします -> 検索フォームを LiveView に送信します -> 新しいエントリを含むリロードされた画面で、最初の選択のデフォルト オプションを再度選択し、2 番目の選択をデフォルトのままにします -> 送信します検索フォームから LiveView へ -> 2 番目の選択が消える
- 2 番目の選択でデフォルト以外のオプションを選択し、最初の選択をデフォルトのままにします -> 検索フォームを LiveView に送信します -> 新しいエントリを含むリロードされた画面で、2 番目の選択のデフォルト オプションを再度選択し、最初の選択をデフォルトのままにします -> 送信します検索フォームから LiveView へ -> 最初の選択が消える
- 両方の選択からデフォルト以外のオプションを選択します -> 検索フォームを LiveView に送信します
clear-> イベントを LiveView に送信するフィールドをクリアします -> 最初と 2 番目の選択のデフォルト値で検索フォームを LiveView に送信します -> 両方の選択が消えます
消えると言うことは、本当に消えることを意味します-クロム開発者ツール内の要素では、セレクターがあるべき場所が空です。
フィールドに値を割り当てる際に問題が発生したと思います。選択を生成するためのコードは次のとおりです。
<div class="form-group col-md-3 main-search__form-group">
<%= label f, :rent_type, gettext("Type"), class: "main-search__form-label" %>
<%= select f, :rent_type, [[key: "", value: ""]] ++ @rent_types,
class: "form-control main-search__form-input main-search__form-input--select",
value: @form_vals.rent_type %>
<%= error_tag_live f, :rent_type, @changeset %>
</div>
<div class="form-group col-md-3 main-search__form-group">
<%= label f, :rooms_number_min, gettext("Rooms") %>
<%= select f, :rooms_number_min,
[
[key: "1+", value: "1"],
[key: "2+", value: "2"],
[key: "3+", value: "3"],
[key: "4+", value: "4"],
[key: "5+", value: "5"]
], value: @form_vals.rooms_number_min,
class: "form-control main-search__form-input main-search__form-input--select" %>
<%= error_tag_live f, :rooms_number_min, @changeset %>
</div>
</div>
@form_vals以前のリクエストからの値で、フォームがその状態を維持するためにロードされます。合格したと確信していますが、形式が適切かどうかはわかりません。LiveView に入るパラメーターの形式:
%{
... some other params ...
"rent_max" => "",
"rent_min" => "",
"rent_type" => "2",
"rooms_number_min" => "1",
"square_area_max" => "",
"square_area_min" => ""
... some other params ...
}
LiveView を次のように残すパラメータの形式form_vals:
%{
... some other params ...
rent_max: "",
rent_min: "",
rent_type: "2",
rooms_number_min: "1",
square_area_max: "",
square_area_min: ""
... some other params ...
}
イベントを LiveView に送信するときclear、クリア フィールド値で応答するだけです。
%{
... many other fields ...
rent_type: "",
rooms_number_min: "1",
... many other fields ...
}
セレクターが消えている理由を誰かが知っている場合は、教えていただければ幸いです。私は本当に立ち往生していて、どうすればいいのかわかりません。