使用Select2插件标记Twitter和Facebook

我正在使用以下代码来简单地搜索并将朋友标记到文本字段上,然后我将其传递给Ajax Post.正如您从我的图像中看到的,我只能允许用户一个接一个地标记朋友.我想模仿Facebook和Twitter,并允许用户键入状态更新,然后在键入"@"时调用select2进行ajax调用以搜索朋友,而不是限制用户仅键入朋友的名称进行标记.这是我目前的代码:

  $("#tag_friends").select2({
      formatResult: peopleFormatResult,
      formatSelection: peopleFormatSelection,    
      tags: true,
      tokenSeparators: [",", ""],
      multiple: true,
      placeholder: "Tag Your Friends",
      minimumInputLength:1,
      ajax: {
          type: "POST",
         url: domain+"friendstag",
        dataType: "json",
        data: function(term, page) {
          return {
            q: term
          };
        },
        results: function(data, page) {
          return {
            results: data
          };
        }
      }
    });

    function peopleFormatResult(people) {
        var html = "";
        html += "";
        html += "
";
        html += people.name + "
";
        html += "
";
        return html;
    }

    function peopleFormatSelection(people) {
        return people.name;
    }

我之后在我的ajax帖子中使用它来使用返回的选定ID:

var tagged_friends = $("#tag_friends").select2("val");

以下是目前的情况:

我已经工作了一个星期没有任何进展,我需要它看起来像下图:

当用户键入@时,将启动标记.此外,任何想法,如果有人标记了一些朋友后我怎么能抓住用户ID？

我撞到了钢墙.任何帮助将不胜感激.

谢谢.