ExtJS ドロップダウン複数選択ボックス lovcombo_javascript スキル

最初は、オプションに入力チェックボックスを追加するだけの非常に簡単なものだと思いました。予想外に、これは機能しません。主に div レイヤーを使用してドロップダウンをシミュレートするいくつかの実装方法をインターネットで検索しました。私もこのアイデアに従って、このプロジェクトの具体的なアプリケーションに基づいて自分で書きたかったのですが、面倒すぎることがわかりました。たまたま別のプロジェクトで extjs を使用していて、拡張機能 lovcombo を見つけ、その例を研究しました (extjs のバージョン 2.3 では、バージョン 3.x には問題があるようです)。この例は難しいものではありません。重要なのは、それを既存のコードに追加し、元のコードの変更をできるだけ少なくすることです。

ドロップダウンの複数選択ボックスの使用中、多くのロジックは主にデータ ソース ストアの構成と選択イベントの処理に焦点を当てます。 extjs 自体のデータと UI の分離モデルにより、カスケードの実装が非常に簡単になります。都道府県ドロップダウン ボックスの選択イベントで都市ドロップダウン ボックスのストアを更新するだけです。注意すべき点は、オプションが選択されている場合、そのオプションが選択されているかキャンセルされているかを決定するために checkField の値を使用する必要があることです。すべて選択、すべて選択解除 (2 つの lovcombo には独自のメソッド selectAll および deselectAll があります)、および選択されたオプションの数 (ストアを横断して各項目の checkField 値を検出する必要があります) のオプションもあります。

コードをコピー コードは次のとおりです:

//ドロップのイベントを選択-down box
select:function(combo, Record, Index)
{
//選択済み
if(record.get(this.checkField))
{
//処理選択時のロジック
}
else
{
//チェックなし
}
}