EasyUIコンボボックスのドロップダウンリスト検索フィルタを達成するために（ファジーマッチ）

　　200以上のプロジェクトまでのドロップダウンリストなので、メガネの膨大な数を使用すると、検索機能の全体を持っているので、花を見つけるために見ていました。だけあり、他のオンラインプレフィックスマッチングプログラムによる投稿を参照して、それらとのプレフィックスの一致は非常に便利ではない場合にのみすることができます。だから我々は、ファジーマッチングプログラムについて記録しました。

結果を実現：

本明細書で使用される、コンボボックス、コンボボックスとして、コンボ<入力>入力ボックスを作成するために使用することができ、使用することができる<選択>プルダウンから選択されます。私は<選択>を使用します。

HTMLコード

< ラベル>関連するプログラム</ ラベル> 
< SELECT クラス= "easyui-コンボボックス" の名前は= "itemsId" ID = "itemsId" スタイル= "幅：135pxは、高さ25ピクセル;" > 
    < オプション>関連するプログラムを選択し、</ オプション> 
</ SELECT >

次に、リモートJSからデータを取得し、検索を実装します。

$（ "＃itemsId" ）.combobox（{ 
                 URL： "XXXXXX" 、
                 編集可能：trueに、
                 ValueField： 'ID' 、
                 テキストフィールド： '名前' 、
                 panelWidth： 220 、//ドロップダウンボックスの幅
                 panelHeight： 250 、ドロップダウンボックス//高さの
                 フィルタ：関数（Q、行）{
                      VAR OPTS = $（この）.combobox（ 'オプション' ）;
                      戻り行[opts.textField] .indexOf（Q）を> -1 ;  
                 }
            }）;

あなたは、クエリを入力する必要があるので、ドロップダウンの項目を編集する必要があるため。デフォルトのエントリを作成し、ドロップダウンコンボボックスを使用して、編集され、編集可能に設定することができます：私はとても悲しいが、真が、それはより明確に機能しそうです。

フィルタ：どのようにR＆LT、データフィルタリングの関数を定義するETURN ロウ[ OPTS 。テキストフィールド] のindexOf （Q ）== のみ一致接頭0、戻り列[opts.textField] .indexOf（ Q）> -1 それはファジーマッチングです。

　　そのようなファジーマッチング機能が実現されます。ただ、問題は、デフォルト値で表示されているものを記録。

デフォルトの表示値がロードされたオプション最初に私が選択したプロパティがtrueで追加するために選択した項目のリストを取得するために、データフォーマッタの機能を使用する場合は、= trueを選択され、データを変更するときに設定されましたが、このアプローチは、ドロップダウンにつながることができますリストは空白として表示されます

したがって、このアプローチは現実的ではないので、彼は他の方法を模索し、解決策を見つけました：

コンボボックス方法を選択します。

単純にコンボボックスを作成する前と後に、行に次のコード行を追加します。

$（ "＃itemsId"）。コンボボックス（ "選択"、rows.name）

これは、オプションを選択し、選択したメソッドのコンボボックスで指定され、「rows.name」オプションは、テキストもでき、価値があります。

もちろん、（このように、あまりにも面倒なこと、そしてちょうどonLoadSuccessの使用に関するレコードのでしょう）から正常にロードされ、リモート・データを扱う、またonLoadSuccessイベントコンボボックスをすることができます：

$（ "＃itemsId" ）.combobox（{ 
                 URL： 'XXXX'、
                 編集可能：真、
                 valueField： 'ID' 、
                 テキストフィールド： 'kcName' 、
                 panelWidth： 220 、
                 panelHeight： 250 、
                 フィルタ：関数（Q、行）{
                      VaRは = $（オプト本）.combobox（ 'オプション' ）;
                      戻り列[opts.textField] .indexOf（Q）> -1 ; 
                 }、
                 onLoadSuccess：関数（データ）{
                      ため（VAR i = 0; iはdata.length <; iは++ ）{
                          場合（データ[I] .ID == rows.itemsId）{ 
                             $（ "#itemsId"）コンボボックス（ "選択"。 、データ[I] .ID）
                         } 
                     } 
                 } 
            }）。

EasyUIコンボボックスのドロップダウンリスト検索フィルタを達成するために（ファジーマッチ）

おすすめ