Semantic UI dropdown select doesn't work properly

help
1

Hello, I have an issue with https://atmospherejs.com/semantic/ui.

Dropdown select element doesn’t work as it should be. If I open my site with this element, I can’t type and search - only select works. However, if I click on another link and go back to my site with this dropdown element then, it works suddenly - I can type and search and everything is OK. However, if I press browser refresh (F5) this element stops working again and I have to click on another link and go back.

html

    <select class="ui search dropdown">
        <option value="">Choose a project</option>
        {{#each projects}}
            <option value={{this}}> {{this}} </option>
        {{/each}}
    </select>

js

Template.myTemplate.onRendered(function(){
$(".dropdown").dropdown();
});

My Meteor project version is 1.4.1.2 (Windows 10) and I installed Semnatic UI with:
meteor remove standard-minifier-css
meteor add semantic:ui juliancwirko:postcss less jquery
Is it a bug or how to fix this behavior? (English is not my native language)

2

Check your browser console.

3

I get no errors or warnings in the browser console and in the server console. If I refresh my browser with F5 or with the browser refresh-icon, meteor doesn’t load jquery for this element and doesn’t replace/build the new element with search function and an appropriate css-style.

4

I created a new default Meteor project and could find a dirty solution with Meteor.setTimeout(function() { $(".dropdown").dropdown(), 0 }); for a (very) small project. But this solution doesn’t work in my larger project because I am using iron-router, checking if a user logged in and showing some specific templates and elements for logged in users. Meteor.setTimeout even with 1000+ delay doesn’t work here.