Select2和Meteor.js怎么样?

时间:2016-12-17 16:26:14

标签: javascript jquery meteor select2

我现在只使用javascript / jquery和meteor几周了,所以请原谅我问一个简单的问题。

我试图在我的Meteor.js应用中使用Select2,并且无法弄清楚如何让它工作。我已经在我的项目中安装了natestrauser:select2,而我显示的jsfiddle只是没有工作。 https://jsfiddle.net/jt0jr9uk

Template.createjob.onCreated( function() {
    $("clientlist").select2({
        placeholder: "Select a client",
        allowClear: false,
    });
});

和html:

<span class="input-group-addon"><i class="glyphicon glyphicon-user"></i></span>
<select id="clientList" class="form-control">
    <option value=""></option>
    <option value="aberfitch">Abercrombie & Fitch</option>
    <option value="bent">Bentley</option>
    <option value="barb">Barbour</option>
    <option value="dcsh">DC Shoes</option>
    <option value="echo">ECHO United</option>
</select>

我也使用bootstrap。我已添加到我的项目中。基本上我只想要这里显示的单个选择框https://select2.github.io/examples.html#single

我应该使用任何进口产品吗?

1 个答案:

答案 0 :(得分:1)

首先,在js级别,您尝试选择一个名为clientlist

的id
Template.createjob.onCreated( function() {
    $("clientlist").select2({....

但是,在html级别,您的id在camelCase中定义

<select id="clientList" class="form-control">

其次,当你选择一个id时,你应该在id之前使用#符号,我的意思是你的jquery应该是这样的,以达到理想的结果:

   Template.createjob.onCreated( function() {
      $("#clientList").select2({
          placeholder: "Select a client",
          allowClear: false,
      });
    });

如果使用meteor&gt; 1.3作为

,则需要在文档顶部导入jquery
import { $ } from 'meteor/jquery';

作为最终建议,我会使用Template.createjob.onRendered()代替Template.createjob.onCreated()

  

渲染DOM后触发模板渲染回调   屏幕。模板启动时会触发创建的回调   实例化但尚未呈现

请查看以下链接以获取完整说明https://stackoverflow.com/a/28783762/7235661