Sylar
Sylar

Reputation: 12092

SemanticUi Dropdown Function Throws off template function

Semantic UI Dropdown function throws of my template event function.

The setup, in Meteor 1.2:

Home Template:

<select id="foo" class="ui dropdown">
  <option value="">Gender</option>
  <option value="1">Male</option>
  <option value="0">Female</option>
</select>
<script>$('.ui.dropdown').dropdown();</script>

Template events:

'change #foo': function(e){
  var selected = $(e.target).val();
  console.log(selected);
}

If I comment out the script, in the Home Template, I get my log message but not so if not commented. Any hack around this?

Upvotes: 1

Views: 77

Answers (1)

user5084201
user5084201

Reputation:

when you want to initialize external plugins (semantic-ui dropdown) you should init it inside onRendered and here are the options for the dropdown plugin I used the onChange callback

http://semantic-ui.com/modules/dropdown.html#/settings

Something like this:

Template.name.onRendered(function () {
  $('.ui.dropdown').dropdown({
    onChange: function (val, text) {
        console.log(val);
    }
  });
});

Upvotes: 1

Related Questions