Semantic Dropdowns Not Reactive


#1

Hi, using 1.8, Blaze and the Semantic-UI atmosphere package.

I have been bashing away at this for 5 days now. If I change the value of a Semantic UI Dropdown, I can pickup the change event and save the new changed value to the DB. Thats all working fine.

However, if I open a second instance of the page, and change the value of the dropdown, it saves to the DB, it updates the value attribute in the other window’s DOM, but the selection on the control in the UI doesn’t change:

      <div class="six wide field">
        <label>Goal</label>
        <div class="ui fluid search normal selection dropdown">
          <input class="goalDropdown" type="hidden" value={{goal.goal_id}}>
          <i class="dropdown icon"></i>
          <div class="default text">Goals</div>
          <div class="menu">
            {{#each goal in goalsCollection}}
            <div class="item" data-value={{goal._id}}>{{goal.title}}</div>
            {{/each}}
          </div>
        </div>
      </div>

Again, the value attribute updates, so the Blaze template is reacting fine to the change of data in the DB, just the control doesn’t update or refresh.


#2

I believe you need to refresh the dropdown after the contents change. Check out this github entry


#3

Hi. That will only refresh the control if new options have been added or taken away. I am, however, wanting to refresh the current selection based on the new data changed in the value attribute.

Is I pickup the change, I can use ‘set exactly’ to set the value based on an array, however that fires an onChange event, which causes a loop.