Sign Up for Free

RunKit +

Try any Node.js package right in your browser

This is a playground to test code. It runs a full Node.js environment and already has all of npm’s 400,000 packages pre-installed, including ember-semantic-ui-dropdown with all npm packages installed. Try it out:

var emberSemanticUiDropdown = require("ember-semantic-ui-dropdown")

This service is provided by RunKit and is not affiliated with npm, Inc or the package authors.

ember-semantic-ui-dropdown v0.0.3

Semantic UI Dropdown for Ember applications

Build Status Semantic

Ember Semantic-UI-DropDown

This is the official Ember library for the Semantic-UI modules.

Installation

Include the library as an NPM dependency, from within an ember-cli app.

ember install ember-semantic-ui-dropdown

If using ember-cli 0.1.5 – 0.2.3

ember install:addon ember-semantic-ui-dropdown

Run the library's blueprint to pull in its Bower dependencies. This only needs to be done once.

ember generate ember-semantic-ui-dropdown

Modules

Dropdown

  • Documentation: Official Documentation
  • Class: ui dropdown
  • Component: ui-dropdown
  • Parameters
    • selected: Bound value that is set to optionValuePath
    • onChange: Event to bind changes too

Replace <div class="ui dropdown"> with {{ui-dropdown}} and fill in your content

Controller

export default Ember.Controller.extend({
    itemActions: [ "Edit", "Remove", "Hide"],
    selectedAction: null,

    actions: {
      updateSelected: function(component, id, value) {
        this.set('selectedAction', id);
      }
    }
});

Template

{{#ui-dropdown class="selection" onChange=(action 'updateSelected')}}
  <div class="default text">Select an item</div>
  <i class="dropdown icon"></i>
  <div class="menu">
  {{#each itemActions as |action|}}
    <div class="item" data-id="{{action}}">
      {{action}}
    </div>
  {{/each}}
  </div>
{{/ui-dropdown}}
RunKit is a free, in-browser JavaScript dev environment for prototyping Node.js code, with every npm package installed. Sign up to share your code.
Sign Up for Free