0

私はこれがほとんどの場合、すばやく簡単なものになると感じていますが、私にとっては少なくとも解決策は分かりにくいものです。拡張jqueryウィジェットのオートコンプリート

jQueryオートコンプリートウィジェットを拡張して、デフォルトとしていくつかの機能を追加します。 selectイベントでthis.options.primaryFieldを参照する必要があります。ここ

$.widget("mynamespace.myAutoComplete", $.ui.autocomplete, { 
    options: { 
     // our options 
     selectedId:0, 
     searchString:'', 
     indexField:'', 
     primaryField:'', 
     secondaryField:'', 

     // set existing ones 
     autoFocus: true, 
     minLength:3, 

     select: function(event,ui) { 
      // runs, but cant access this.options.<anything> 
     } 

    }, 

    _myselect: function (event,ui) { 
     //does not run 
     console.log("in myselect"); 
    }, 

    _renderItem: function (ul, item) { 
     var icon='marker'; 
     return $("<li>") 
      .append ('<div><a><i class=\"fi-' + icon + '"></i>' + item[this.options.primaryField] + "<br>" + item[this.options.secondaryField] + "</a><div>") 
      .appendTo (ul); 
    } 
}); 

私が見つけた解決策: Howto access data held in widget options when inside a widget event handlerjQuery Widget Factory access options in a callback methodjQuery-ui: How do I access options from inside private functions

しかし、私はそれらのいずれかを動作させることはできません。私はちょうど(当然の$ .widgetに追加する(...クラス)

_create: function() { 

     // does not fire _myselect on select 
     this._on(this.select, { change: "_myselect"}); 
     this._on(this.select, $.proxy(this._myselect, this)); 
     this._on(this.select, $.bind(this._myselect, this)); 

     this._super(); 
    }, 

私も同様_init機能にそれらを追加しようとしました:これは私がこれらのソリューションから派生したコードです項目をクリックするとthis.options.selectedId、searchStringの、などを設定できるようにしたい事前に

おかげ

答えて

0

最後に、誰もが他の同じ問題打つためにこれを釘付け:。

$.widget("ui.autocomplete", $.ui.autocomplete, { 
_init: function() { 
    this.element.on("autocompleteselect", $.proxy(this.myselect, this)); 
}, 
options: { 
    // our options 
    selectedId:0, 
    searchString:'', 
    indexField:'', 
    primaryField:'', 
    secondaryField:'', 
    .... 
}, 
myselect: function (event, ui) { 
    // event and ui work as normal 
    // this, refers to the widget, so the options are available via 
    // this.options.<blah> 
} 
を。

私はまた、問題で私が選んだ名前空間も問題に関わっているようだと指摘しておきます。私がui.autocomplete以外のものを使用している場合(私はこのコードをどこに置いても、未修正のオートコンプリートをアクセス不可能にすると推測します)、イベントは起動しません。つまり、ui.autocompleteという名前空間であっても、私がこの質問で言及した3つのthis._on ..コマンドはまだ失敗しました。

関連する問題