2016-12-17 3 views
0

Я уже несколько недель использую javascript/jquery и meteor, поэтому простите меня за вопрос, что будет простым вопросом.Select2 и Meteor.js как?

Я пытаюсь использовать Select2 в своем приложении Meteor.js и не могу понять, как заставить его работать. Я установил 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> 

Я использую самозагрузки также. Что я добавил в свой проект. И в основном я просто хочу выбрать единицу select, как показано здесь https://select2.github.io/examples.html#single

Должен ли я использовать импорт или что-нибудь еще?

ответ

1

Итак, прежде всего, на Js уровне вы попытались выбрать идентификатор, названный clientlist

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

Однако, на уровне HTML, ваш идентификатор определен в верблюжьего

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

Во-вторых , когда вы выбираете идентификатор, вы должны использовать знак # перед идентификатором, я имею в виду, что ваш jquery должен выглядеть так, чтобы получить желаемый результат:

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

Вы должны импортировать JQuery в верхней части документа, если вы используете метеор> 1.3, как

import { $ } from 'meteor/jquery'; 

В качестве последнего предложения, я хотел бы использовать Template.createjob.onRendered() вместо для Template.createjob.onCreated()

Шаблон визуализации обратного вызова после того, как DOM отображается на экране . Созданный обратный вызов вызывается, когда шаблон является экземпляром, но еще не оказало

Проверьте ссылку для полного объяснения https://stackoverflow.com/a/28783762/7235661

+0

Я не могу поверить, как я проглядел camelcasing! Спасибо, Кагри. Я также изменил на onRendered() согласно вашему предложению. Имеет смысл после прочтения ссылки, которую вы предоставили. – Sam

Смежные вопросы