Выберите2 jquery плагин в popup?

У меня есть два select тег реализации select2 jquery plugin:Выберите2 jquery плагин в popup?

select тег нормально: работает нормально, можно найти.
select тег в popup: не возможно поиск.

<head> 
 
    <link rel="stylesheet" href="https://almsaeedstudio.com/themes/AdminLTE/plugins/select2/select2.min.css"> 
 
    <link rel="stylesheet" href="https://almsaeedstudio.com/themes/AdminLTE/bootstrap/css/bootstrap.min.css"> 
 
    <link rel="stylesheet" href="https://almsaeedstudio.com/themes/AdminLTE/dist/css/AdminLTE.min.css"> 
 
    <script src='https://almsaeedstudio.com/js/bootstrap.min.js'></script> 
 
    <script src='https://almsaeedstudio.com/themes/AdminLTE/dist/js/demo.js'></script> 
 
    <script src='https://almsaeedstudio.com/themes/AdminLTE/plugins/select2/select2.full.min.js'></script> 
 
    <script src='https://almsaeedstudio.com/themes/AdminLTE/dist/js/app.min.js'></script> 
 
    <script src='https://almsaeedstudio.com/themes/AdminLTE/bootstrap/js/bootstrap.min.js'></script> 
 
    <script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script> 
 
</head> 
 
<body> 
 
<div> 
 
    <select id="categoryID" onchange="changeCategory(this)" class="form-control select2" style="width: 100%"> 
 
     <option id="1">Games</option> 
 
     <option id="2">Sport</option> 
 
     <option id="3">Sport Games</option> 
 
    </select> 
 
    <script src='https://almsaeedstudio.com/themes/AdminLTE/dist/js/demo.js'></script> 
 
    <script src='https://almsaeedstudio.com/themes/AdminLTE/plugins/select2/select2.full.min.js'></script> 
 
    <script src='https://almsaeedstudio.com/themes/AdminLTE/dist/js/app.min.js'></script> 
 
    <script src='https://almsaeedstudio.com/themes/AdminLTE/bootstrap/js/bootstrap.min.js'></script> 
 

 
    <button class="btn btn-block btn-primary" data-toggle="modal" 
 
      data-target="#addNewCategoryModal">New 
 
    </button> 
 
    <div class="modal fade" id="addNewCategoryModal" tabindex="-1" role="dialog"> 
 
     <div class="modal-dialog" role="document"> 
 
      <div class="modal-content"> 
 
       <div class="modal-header"> 
 
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span 
 
          aria-hidden="true">&times;</span> 
 
        </button> 
 
        <h4 class="modal-title" id="titleLabel">New Category</h4> 
 
       </div> 
 
       <div class="modal-body"> 
 
        <div class="form-group"> 
 
         <select id="categoryID" onchange="changeCategory(this)" class="form-control select2" style="width: 100%"> 
 
          <option id="1">Games</option> 
 
          <option id="2">Sport</option> 
 
          <option id="3">Sport Games</option> 
 
         </select> 
 
        </div> 
 
       </div> 
 
      </div> 
 
     </div> 
 
    </div> 
 
    <script type="text/javascript"> 
 
     function initialSelect() { 
 
      $(".select2").select2(); 
 
     } 
 
     $(function() { 
 
      //Initialize Select2 Elements 
 
      $(".select2").select2(); 
 
     }); 
 
     $('#addNewCategoryModal').on('show.bs.modal', function (event) { 
 
      var modal = $(this) 
 
      modal.find('.modal-body #categoryID').select2(); 
 
      modal.find('.modal-body categoryID').select2(); 
 
      modal.find('.select2').select2(); 
 
      $(".select2").select2(); 
 
     }) 
 
    </script> 
 

 
</div> 
 
</body>

Любой помогает. Благодарю.

источник

2016-01-20 rome 웃

Вы указали tabindex="-1" для модальных. Из-за этого вход не фокусируется. Удалите tabindex из вашего кода, и он должен работать.

Также существуют следующие проблемы в коде

вы включили самозагрузки и Select2 JS файлы несколько раз ваш HTML. Включите только один раз.
Включите ваш файл jquery перед включением файла bootstrap js.
Вы используете categoryID несколько раз с вашей HTML-страницей. Идентификаторы должны быть уникальными.

источник

2016-01-20 08:02:17

Большое спасибо за это. –

Выберите2 jquery плагин в popup?

ответ

Смежные вопросы