Pop selection off выпадающее меню

Question

У меня есть вопрос о том, чтобы выбрать выбор из выпадающего меню. У меня есть раскрывающийся список, который динамически заполняется именами людей, и я хотел бы, чтобы имя выбрано, чтобы выскочить из раскрывающегося меню и появилось в div рядом с ним. Выпадающее меню:

 <div class="col-md-4"> 
      <div class="dropdown"> 
      <button style="width: 100%;" class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown">Select Group Members 
      <span class="caret"></span></button> 
      <ul class="dropdown-menu scrollable-menu" role="menu"> 
      {{#each users}} 
       <li data-uid={{this.u_id}}>{{this.full_name}}</li> 
      {{/each}} 
      </ul> 
      </div> 
     </div> 

И ДИВ Я хотел бы информацию (имя) появляться:

 <div class="col-lg-4"> 
      <h2 class="text-center" style="margin-top: 0;">Selected Group Members</h2> 
      <ul class="list-unstyled"> 
      <li data-uid={{this.u_id}} class="text-center">{{this.full_name}}</li> 
      </ul> 
     </div> 

Я воображая, это может быть сделано с некоторыми JQuery, который я, к сожалению, не слишком хорошо, поэтому я не совсем уверен, как это сделать. Любая помощь приветствуется!

Answer 1

Это должно делать работу. Пожалуйста, проверьте.

// selected element 
var selections = []; 
// container that holds selections 
var listContainer = $('.container .list-unstyled'); 

// sorting array of objects by provided field 
var sortBy = function (arr, field) { 
    return arr.sort(function (a, b) { 
     if (a[field].toLowerCase() < b[field].toLowerCase()) return -1; 
     if (a[field].toLowerCase() > b[field].toLowerCase()) return 1; 
     return 0; 
    }); 
}; 

// redraw list on container 
var reorder = function(){ 
    listContainer.html(''); 
    for(var i = 0; i < selections.length; i++){ 
     listContainer.append('<li data-uid=' + selections.id + '>' + selections.value + '</li>'); 
    } 
} 

// list items click handler 
$('ul.list-unstyled li').click(function(){ 
    selections.push({ 
     id: $(this).attr('data-uid'), 
     value: $(this).text() 
    }); 

    selections = sortBy(selections, 'name'); 
});