4

typeaheadブートストラップを使用して、選択した値に関連する特定の値を設定するために、メニューから項目が選択またはフォーカスされたときにトリガーしたいと思います。

私が何を意味するのかを正確に理解するには、コードのコメントを参照してください。 

element.typeahead({
    minLength: 3,
    source: function () {
        // users is a Backbone.Collection
        users = _.map(users, function(user) {
            return user.get('first_name')+' '+user.get('last_name');
        });

        return users;

    }
}).change(function (event) {
        // this function which is called when the user set a value 
        // should be able to get the user.get('id') of the selected user
        // any idea how to make it?
});
4

1 に答える 1

4

これはあなたにとって役立つかもしれません。リモート データ ソースを呼び出すことができる Typehead の拡張機能を使用します。必要なことができるコールバック関数が付属してonselect()います。

先行入力拡張 GIST

サンプルコードは次のとおりです。

    initialization: function() {
        this.user = new User();
        // Or fetch the user so it has an id, etc.
    },
    initTypeahead: function() {
        var self = this;
        var element = this.$('#input');

        element.typeahead({
            source: userCollection.toJSON(),
            property: 'name',
            onselect: function(userObj) {  // This is the line to pay attention to
                var userModel = userCollection.get(userObj.id);
                // Do something with the userModel
            }
        });
    }

したがって、基本的に私のコードでは、DB にクエリを実行すると、ajax から返されたデータに各選択の値を設定する JSON が返されます。

を使用してonselect(obj)、obj をコールバックに渡していますが、たまたまそれをデータとして入力要素にアタッチしています。しかし、既に持っているユーザー データ (user.id) を利用する独自のカスタム コードを簡単に追加し、選択した値に合わせて何をすることもできます。onselect()つまり、適切なスコープ内にある限り、コールバックで user.id を使用できる必要があります。

于 2012-08-24T20:04:57.763 に答える