3

自動提案とタグ付けを処理するために jQuery プラグインTag-Itを使用しています。Ajax正常に動作している呼び出しを使用してデータを取得しています。

現在、データは次の形式で返されています。

{"itemID":"ItemName"}

例えば：

{"1":"Yellow","2":"Green"}

これはうまくいっています。

私がやりたいことは、ユーザーに返されたタグをクリックさせ、データを非表示フィールドに次のように保存させることです。

<input type="hidden" name="tag['itemID']['itemName']"/>

私はそれを行う方法を理解できないようです.誰かがこれを経験し、私を正しい方向に向けることができますか?

4

1 に答える 1

3

これを行うには、オートコンプリート Ajax 呼び出しから返された追加データを Tag-it タグ イベントに渡す必要があります。

スコープに変数itemIdを追加します。これは、オートコンプリート アイテムからの追加データを格納するために使用されます。

{
    var itemId;

タグ作成動作を呼び出すことができるように、タグ要素への参照を取得します

    var theTags = $('#tags');

    theTags.tagit({

オートコンプリートのイベントを処理selectし、選択したオートコンプリート アイテムからの追加データを保存してから、タグを作成します。

        autocomplete: {
            source: [{id:1,value:'New 1'},{id:2,value:'New 2'}],
            select: function(event,ui) {
                itemId = ui.item.id;
                theTags.tagit("createTag", ui.item.value);
                return false;
            }
        },

afterTagAddedTag-itのイベントを処理します。ここでは、追加したばかりのタグを変更するカスタム動作を実装できます。

        afterTagAdded: function(event, ui) {
            if (itemId) {
                $(ui.tag).find('input')
                     .attr('name', "tag[\'" + itemId+ "']['" + ui.tagLabel + "']");
                itemId = null;
            }
        }
    });
}

http://jsfiddle.net/DCJsj/で、このソリューションの実例を参照してください。

于 2012-12-13T12:33:39.107 に答える