Bootstrap dropdown item binding с Ajax source

Question

У меня есть кнопка выпадающего списка Bootstrap, я хочу получить данные, когда пользователь нажимает эту кнопку, вместо того, чтобы мне нужно загружать список стран во время загрузки страницы, вот мой код;

<div class="btn-group"> 
<input class="text-box single-line" data-val="true" data-val-required="The Country field is required." id="Country" name="Country" type="text" value="US" /> 
<a class="btn dropdown-toggle country" id="country" data-toggle="dropdown"> 
<span class="caret"></span> 
</a> 
<ul class="dropdown-menu countrys" role="menu" aria-labelledby="dropdownMenu"> 
    //store country list 
</ul> 
</div> 

я нажимаю кнопку раскрывающейся, он не может вызвать Jquery работы, кажется, Bootstrap не позволяют пользовательский выпадающую функции.

$(document).ready(function() { 
     $('#country').click(function() { 
      // Only call notifications when opening the dropdown 
      if (!$(this).hasClass('open')) { 
       $.ajax({ 
        type: "GET", 
        url: "/getCountries", 
        async: false, 
        dataType: "script" 
       }); 
      } 
     }); 
    }); 

Answer 1

Вы можете попробовать добавить запрос ajax в раскрывающееся меню. что-то вроде этого:

$('#myDropdown').on('show.bs.dropdown', function() { 
    // do something… 
}) 

show.bs.dropdow-- Это событие срабатывает сразу, когда метод экземпляра шоу называется. Переключающий элемент привязки доступен как свойство relatedTarget события.