При нажатии кнопки div, переключение выпадающего меню select2 - PullRequest
Новая
       1

При нажатии кнопки div, переключение выпадающего меню select2

0 голосов
/ 20 января 2020

Я хочу переключать (открывать / закрывать) раскрывающееся меню окна выбора select2, когда я щелкаю по указанному c div с идентификатором "#clickme"

Вот код, который я используя, чтобы открыть выпадающее меню опций: 

$(document).ready(function() {

$("#clickme").click(function(){
$("#postitemlocation").select2("open");
});

});

Но только при этом откроется выпадающее меню select2. Я пытался 

$("#postitemlocation").select2("toggle");

, но не работает вообще. Есть идеи?

1 Ответ

1 голос
/ 20 января 2020

После комментариев других людей я нашел очень простое решение, которое поможет. Иногда простые подходы являются лучшими.

Вот мой код на случай, если кому-то еще понадобится подобная функция с плагином select2. 

$("#postitemlocation").select2()

$("#clickme1").click(function() {
  $("#postitemlocation").select2("open");
  $("#clickme1").hide();
  $("#clickme2").show();
});

$("#clickme2").click(function() {
  $("#postitemlocation").select2("close");
  $("#clickme1").show();
  $("#clickme2").hide();
});
#clickme1,
#clickme2 {
  float: right;
  margin-right: 50px;
  margin-top: 80px;
  font-weight: 600;
  text-decoration: underline;
  cursor: pointer;
}

#clickme2 {
  display: none;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<link href="https://cdn.jsdelivr.net/npm/select2@4.0.12/dist/css/select2.min.css" rel="stylesheet" />
<script src="https://cdn.jsdelivr.net/npm/select2@4.0.12/dist/js/select2.min.js"></script>
<select id="postitemlocation">
  <option value="">Choose a location</option>
  <option value="1">New York</option>
  <option value="2">London</option>
  <option value="3">Tokyo</option>
  <option value="4">Miami</option>
  <option value="5">Rome</option>
</select>
<div id="clickme1">click me</div>
<div id="clickme2">click me</div>
...