如何通过单击按钮将数据添加到 MagicSuggest 输入

Question

我正在使用 MagicSuggest 在一个表格中。该插件运行良好，但我希望具有通过单击按钮向其添加数据的功能。

这是我在下面尝试过的方法，它向其中添加了数据，但是如果我单击输入，数据就会消失。

HTML

<div class="qa-suggested-profiles">
    <a href="#/" data-name="John Doe" class="btn btn-sm tag-profile-btn">Add this profile</a>
</div>

JS

$('.qa-suggested-profiles').on('click', '.btn', function(){
    var profileName = $(this).data('name');
    $('#tag-business .ms-sel-ctn').prepend('<div class="ms-sel-item ">' + profileName + '<span class="ms-close-btn"></span></div>');
    $('#tag-business .ms-sel-ctn input').attr('placeholder', '').width('auto');
    $('#tag-business .ms-sel-ctn div').prepend('<input type="hidden" value="1">');
});

Answer 1

我在文档中找到了完成此任务的内容。转到 http://nicolasbize.com/magicsuggest/doc.html 并搜索 setValue([array] ids) 请参见下面的示例：

var ms = $('#ms-setValue').magicSuggest({
  data: 'data.json'
});
ms.setValue([2, 3, 4]);

这是我使用的最终代码，我还添加了 removeFromSelection 来清除每个按钮点击时的选择

$('.qa-suggested-profiles').on('click', '.btn', function(){
    var profileName = $(this).data('name');
    var ms = $('#tag-business').magicSuggest({
      data: '/data/business-profiles.json'
    });
    // remove current value
    ms.removeFromSelection(ms.getSelection(), true);
    // add selected value
    ms.setValue([profileName]);
});

如何通过单击按钮将数据添加到 MagicSuggest 输入

How to add data to MagicSuggest input via a button click

jquery

autocomplete

magicsuggest