发送 ID 但显示标签答案

【问题标题】：Send ID but show label发送 ID 但显示标签
【发布时间】：2012-12-11 09:39:30
【问题描述】：

我正在使用 jQuery 插件 Tag-It 来处理自动建议和标记。我正在使用运行正常的Ajax 调用获取数据。

此时的数据正在以以下格式返回：

{"itemID":"ItemName"}

例如：

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

一切顺利。

我想要做的是让用户点击返回的标签，并将数据存储在隐藏字段中，如下所示：

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

我似乎不知道该怎么做，有没有人有这方面的经验并能够指出我正确的方向？

【问题讨论】：

当你说数据是由Ajax返回的时候，你的意思是说你是在使用自动完成功能来获取可以添加的标签列表吗？

标签： jquery ajax tag-it

【解决方案1】：

为此，需要将从自动完成 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;
            }
        },

为 Tag-it 处理 afterTagAdded 事件。在这里可以实现修改刚刚添加的标签的任何自定义行为。

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

在http://jsfiddle.net/DCJsj/查看此解决方案的工作示例

【讨论】：

完美！感谢您的提示。设法让这个工作现在。