2017-02-20 11 views
0

Что я сейчас: я показать содержимое JSON в опциях в пределах выбора, который с помощью плагина bootstrap-duallistbox показывает его в виде двойного списка с которой Определенной выбранные параметры могут быть добавлены или удалены.Проблем с Bootstrap Dual List Box

Моя проблема: Что не получается, что при выборе варианта и передаче его в следующую область вытащите все, а не только одну, я не знаю, чего ожидать, надеюсь, они могут мне помочь, я оставляю аванс Я принимаю here

ответ

0

вместо использования Jquery двойного окна списка, вы можете использовать директиву angularJs здесь https://github.com/frapontillo/angular-bootstrap-duallistbox скачать почтовый индекс и установить его с помощью bower если вы не поклонник с bower вы можете изменить пути к script и css файлов этот код ниже:

<!doctype html> 

<head> 
<meta charset="utf-8"> 
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 
<title>AngularJS Bootstrap Duallistbox example</title> 
<meta name="description" content=""> 
<meta name="viewport" content="width=device-width"> 
<link rel="stylesheet" href="styles/main.css"> 
<link rel="stylesheet" href="../bower_components/bootstrap/dist/css/bootstrap.css"> 
    <link rel="stylesheet" href="../bower_components/bootstrap-duallistbox/src/bootstrap-duallistbox.css"> 
</head> 
<body ng-app="bsDuallistboxApp"> 

<!--[if lt IE 9]> 
    <script src="../bower_components/es5-shim/es5-shim.js"></script> 
    <script src="../bower_components/json3/lib/json3.min.js"></script> 
<![endif]--> 

<div class="container" ng-controller="MainCtrl"> 
    <select 
      ng-model="model" 
      ng-options="obj as obj.text for obj in list track by obj.id" 
      multiple 
      bs-duallistbox 
      bootstrap2="{{ settings.bootstrap2 }}" 

      move-on-select="{{ settings.moveOnSelect }}" 
      preserve-selection="{{ settings.preserveSelection }}" 

      move-selected-label="{{ settings.moveSelectedLabel }}" 
      move-all-label="{{ settings.moveAllLabel }}" 
      remove-selected-label="{{ settings.removeSelectedLabel }}" 
      remove-all-label="{{ settings.removeAllLabel }}" 

      non-selected-list-label="{{ settings.nonSelectedListLabel }}" 
      selected-list-label="{{ settings.selectedListLabel }}" 

      postfix="{{ settings.postfix }}" 
      select-min-height="{{ settings.selectMinHeight }}" 

      filter="{{ settings.filter }}" 
      filter-values="{{ settings.filterValues }}" 
      filter-non-selected="settings.filterNonSelected" 
      filter-selected="settings.filterSelected" 
      filter-placeholder="{{ settings.filterPlaceholder }}" 
      filter-clear="{{ settings.filterClear }}" 
      info-all="{{ settings.infoAll }}" 
      info-filtered="{{ settings.infoFiltered }}" 
      info-empty="{{ settings.infoEmpty }}" 

    </select> 
    <div class="row"> 
    <button class="btn btn-large" ng-click="reset()">Reset</button> 
    <button class="btn btn-large" ng-click="add()">Add</button> 
    </div> 
</div> 

<script src="../jquery/jquery.js"></script> 
<script src="../angular/angular.js"></script> 
<script src="../bootstrap-duallistbox/src/jquery.bootstrap-duallistbox.js"> </script> 
<script src="../common/module.js"></script> 
<script src="../bootstrap/dist/js/bootstrap.js"></script> 
<script src="../src/directives/bsDuallistbox.js"></script> 

<script src="scripts/app.js"></script> 
<script src="scripts/controllers/main.js"></script> 
</body> 
</html> 

все файлы включены в zip-файл, вам нужно просто переопределить путь.

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

  • Нет связанных вопросов^_^