5

タグ付けにjquery uiプラグインを使用しています:

https://github.com/aehlke/tag-it

私はいくつかの問題を抱えています:

  1. ユーザーがリストから選択したときに、そのタグの ID と値を保存したいと考えています。

  2. AJAX 呼び出しによって返されたリストからのみタグを作成します

    $(function() {
      $('#tags').tagit({tagSource:function( request, response ) {
    $.ajax({
    type:"GET",
    url: "http://some_link",
    dataType: "jsonp",
    data:{
        term:request.term,
        }, 
        success: function( data ) {
            response( $.map( data, function( item ) {
                return {
                    label: item.label,
                    value: item.value,
                    id:item.id
                };  
            }));
        }   
        });
    }
    , triggerKeys: ['enter', 'comma', 'tab']});
    });
    
4

2 に答える 2

5

2 番目の質問への回答として、Tag-It リポジトリの Chris Leishman のフォークにはrequireAutocomplete 、オートコンプリート リスト内のアイテムのみをタグとして使用できるようにする新しいプロパティが含まれています。

彼のプル リクエストはこちらにあります: https://github.com/aehlke/tag-it/pull/37

このバージョンの JS ファイルをhttps://github.com/chrisleishman/tag-itからダウンロードします。

通常のプロパティのように使用します。

$(selector).tagit({
        requireAutocomplete: true,
        tagSource: [...]
});

あなたの最初の質問については、私は自分でこれに取り組んでいるので、解決策が見つかったら回答を更新します.

自分のローカル TagIt.js の 271 行を変更して修正しました。

var tag = that.createTag(ui.item.value);

var tag = that.createTag(ui.item.label);

これにより、オートコンプリート リストからオプションを選択した後、ラベルの代わりにアイテムの ID が表示されるという問題が修正されました。

アップデート

ここでは、各タグの ID を保存する方法について説明します。

私が最初にしたことは、メソッドをオーバーライドしてcreateTag、labelName パラメーターを含めることでした (必要に応じて元のパラメーターを変更できます。私はそれをオーバーライドすることを好みました)。

$.ui.tagit.prototype.createTag = function (labelName, value, additionalClass) {
 // The origional code from createTag here
}

現在の値のパラメーターがトリミングされるのと同じ方法で、labelName をトリミングします。

value = $.trim(value);
labelName = $.trim(labelName)

新しい labelName を使用するようにラベル変数を変更します。

    var label = $(this.options.onTagClicked ? 
      '<a class="tagit-label"></a>' :
      '<span class="tagit-label"></span>').text(labelName);

元のソースのオートコンプリート セクションで、createTag の呼び出しを変更して、新しいラベルを含めます。

var tag = that.createTag(ui.item.label, ui.item.value);
于 2012-04-13T10:40:53.063 に答える
0

このソリューションは、複数の値と質問への回答を処理するためのものです。

ユーザーがリストから選択したときに、そのタグの ID と値を保存したいと考えています。

上記のソリューションに触発されました(したがって、それを読む必要があります:-)):

var tag = that.createTag(ui.item); // since ui.item will have everything, label, value, id and other things

次に createTag 関数で

var item = value;
value = item.value;
...
 var tag = $('<li></li>')
            .data('tag_item_data',item)// add this line
            .addClass('tagit-choice ui-widget-content ui-state-default ui-corner-all')
            .addClass(additionalClass)
            .append(label);

タグを取得するには、関数を作成するだけです

 assignedTagsData : function(){
         // Only to be used when singleField option is not seletced
        var tags = [];

         this.tagList.children('.tagit-choice').each(function() {
                tags.push($(this).data('tag_item_data') );
            });
         return tags;

    }
于 2012-04-26T11:08:36.807 に答える