Javascript 选择2:使用ajax创建标记

Javascript 选择2:使用ajax创建标记,javascript,jquery-select2,jquery-select2-4,Javascript,Jquery Select2,Jquery Select2 4,我正在使用select2库 我的select2元素可以通过ajax在数据库中搜索每个标记,这很好 我的问题是,我希望用户也能够创建一个新的标签。查看他们的文档,我应该使用createTag选项;但是,只要我点击元素并按下每个键,就会触发该命令 有人能为我如何实现目标提供指导吗 这是到目前为止我的代码 我正在使用ajax top搜索标记,但我还想为数据库创建新的标记。我已经尝试过通过createTag来实现这一点,但是当我点击HTML元素并按下每个键时,它似乎就会启动。 这是我的密码: $('.t

我正在使用select2库

我的select2元素可以通过ajax在数据库中搜索每个标记,这很好

我的问题是,我希望用户也能够创建一个新的标签。查看他们的文档,我应该使用
createTag
选项;但是,只要我点击元素并按下每个键,就会触发该命令

有人能为我如何实现目标提供指导吗

这是到目前为止我的代码

我正在使用ajax top搜索标记,但我还想为数据库创建新的标记。我已经尝试过通过createTag来实现这一点,但是当我点击HTML元素并按下每个键时,它似乎就会启动。
这是我的密码:
$('.tags')。选择2({
标签:是的,
占位符:“这些标记将应用于所有行”,
标记分隔符:[','],
阿贾克斯:{
url:“/api/tags/find”,
数据类型:“json”,
数据:函数(参数){
返回{
q:$.trim(参数术语)
};
},
processResults:函数(数据){
返回{
结果:数据
}
},
是的,
},
createTag:函数(参数){
alert('tagcreated')//这是我将要发布的ajax帖子。
}
});

再次阅读文档后,我可以看出我应该使用这些事件

我使用
createTag
选项将
newTag:true
分配给新创建的标记,并使用
select2:selected
事件检查是否已选择新标记,如果已选择,则向服务器发送ajax请求以创建该标记


          $('.tags').select2({
              tags: true,
              placeholder: "These tags will apply to all lines",
              minimumInputLength: 3,
              tokenSeparators: [','],
              ajax: {
                  url: '/api/tags/find',
                  dataType: 'json',
                  data: function (params) {
                      return {
                          q: $.trim(params.term)
                      };
                  },
                  processResults: function (data) {
                    return {
                        results: data
                    }
                  },
                  // cache: true,
              },
              createTag: function(params) {
                  let term = $.trim(params.term);
                  if (term.length < 3)
                  {
                      return null
                  }

                  return {
                      id: term,
                      text: term,
                      newTag: true,
                  }
              },
          });

          $('.tags').on('select2:select', function (e) {
              let tag = e.params.data;
              if (tag.newTag === true)
              {
                  axios.post('/api/newtag', {
                      name: tag.text,
                      type: 'default',
                  })
              }
          });


$('.tags')。选择2({
标签:是的,
占位符:“这些标记将应用于所有行”,
最小输入长度:3,
标记分隔符:[','],
阿贾克斯:{
url:“/api/tags/find”,
数据类型:“json”,
数据:函数(参数){
返回{
q:$.trim(参数术语)
};
},
processResults:函数(数据){
返回{
结果:数据
}
},
//是的,
},
createTag:函数(参数){
设term=$.trim(params.term);
如果(术语长度<3)
{
返回空
}
返回{
id:术语,
案文:任期,
纽塔格:没错,
}
},
});
$('.tags')。打开('select2:select',函数(e){
设tag=e.params.data;
if(tag.newTag==真)
{
axios.post(“/api/newtag”{
名称:tag.text,
键入:“默认值”,
})
}
});

再次阅读文档后,我可以看出我应该使用这些事件

我使用
createTag
选项将
newTag:true
分配给新创建的标记,并使用
select2:selected
事件检查是否已选择新标记,如果已选择,则向服务器发送ajax请求以创建该标记


          $('.tags').select2({
              tags: true,
              placeholder: "These tags will apply to all lines",
              minimumInputLength: 3,
              tokenSeparators: [','],
              ajax: {
                  url: '/api/tags/find',
                  dataType: 'json',
                  data: function (params) {
                      return {
                          q: $.trim(params.term)
                      };
                  },
                  processResults: function (data) {
                    return {
                        results: data
                    }
                  },
                  // cache: true,
              },
              createTag: function(params) {
                  let term = $.trim(params.term);
                  if (term.length < 3)
                  {
                      return null
                  }

                  return {
                      id: term,
                      text: term,
                      newTag: true,
                  }
              },
          });

          $('.tags').on('select2:select', function (e) {
              let tag = e.params.data;
              if (tag.newTag === true)
              {
                  axios.post('/api/newtag', {
                      name: tag.text,
                      type: 'default',
                  })
              }
          });


$('.tags')。选择2({
标签:是的,
占位符:“这些标记将应用于所有行”,
最小输入长度:3,
标记分隔符:[','],
阿贾克斯:{
url:“/api/tags/find”,
数据类型:“json”,
数据:函数(参数){
返回{
q:$.trim(参数术语)
};
},
processResults:函数(数据){
返回{
结果:数据
}
},
//是的,
},
createTag:函数(参数){
设term=$.trim(params.term);
如果(术语长度<3)
{
返回空
}
返回{
id:术语,
案文:任期,
纽塔格:没错,
}
},
});
$('.tags')。打开('select2:select',函数(e){
设tag=e.params.data;
if(tag.newTag==真)
{
axios.post(“/api/newtag”{
名称:tag.text,
键入:“默认值”,
})
}
});