如何通过点击按钮将数据添加到MagicSuggest输入
问题描述:
我在表单中使用MagicSuggest 。该插件工作良好,但我想要通过点击按钮添加数据的功能。如何通过点击按钮将数据添加到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">');
});
答
我发现了完成此任务的文档中的东西。转到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]);
});