ウェブサイト全体でhttp://code.drewwilson.com/entry/autosuggest-jquery-pluginの autoSuggest プラグインを使用して、さまざまなアイテムを検索しています。このプラグインの主な機能の 1 つは、選択が追加されるとコールバック関数が呼び出され、これが追加された新しいデータであるか、Web サービスから取得されたものであるかを確認してから、いくつかの変数を更新することです (送信に使用します)。
今まで何も考えずに使用してきましたが、OOP の方法で JS オブジェクトを作成して、このプラグインと他の関連する関数 (一般的なコールバック) と構成値 (URL) などをラップすることにしました。
クラスには、選択が追加および削除されると更新されるさまざまなデータ変数があります。コードの途中で、コールバックが引数を 1 つしかとらず、これらの変数またはオブジェクトのコンテキストをこれらのコールバックに渡す方法がないことに気付きました (私には明らかです)。
以下は、これまでに書いたコードです。
var coSuggest = function(options) {
this.selector = options.selector;
this.options = options;
//this.that = this;
//this.submitURL = options.submitURL;
//if y=type is not defined , default type will be people
if ( typeof (options.type) === 'undefined') {
this.type = 'people';
} else {
this.type = options.type;
}
// if as_options are not defined, as_options will be a empty object
//console.log(typeof(options.as_options));
if ( typeof (options.as_options) === 'undefined') {
this.as_options = {};
} else {
this.as_options = options.as_options;
}
this.valuesField = $('#as-values-' + this.as_options.asHtmlID);
//the initData field will be an array of object containing {id,value} of prefilled items initially
//the addData field will be an array of object containing {id,value} of new selected items from the suggestions
//the newData field will be an array of strings [values] containing the new values added
//the removeData field will be an array of objects containing {id,value} of the items from data to be removed
if ( typeof (options.initData) !== 'undefined') {
this.initData = options.initData;
this.as_options.preFill = this.initData;
}
this.as_options.selectionAdded = this.selectionAdded;
// callback function to be added in as_options as selectionAdded
this.as_options.selectionRemoved = function(elem) {
console.log(elem);
}
//return this
};
//urlConf for searching the items sitewide
coSuggest.prototype.urlConf = {
people : 'abc',
interest : "index.php/profile/getInterestsSkillsTags",
skill : 'xyz',
teacher : 'xyz',
designation : 'xyz',
city : 'xyz',
subject : 'xyz',
};
// callback function to be added in as_options as selectionAdded
coSuggest.prototype.selectionAdded = function(elem) {
//console.log($(this).find('.as-values'));
console.log(elem);
}
//bind function to bind the autoSuggest plugin with the selector provided
coSuggest.prototype.bind = function(options) {
//console.log(as_options);
$(this.selector).autoSuggest(base_url + this.urlConf[this.type], this.as_options);
}
コードの再利用性を失わずにこれを行うにはどうすればよいですか?