Как предварительно выбрать ВСЕ параметры в раскрывающемся списке данных мобильного jquery с привязкой к выбыванию? - PullRequest
0 голосов
/ 05 февраля 2012

Может ли кто-нибудь показать мне, как предварительно выбрать все элементы в выделенной привязке с привязкой к данным с множественным набором тегов выбора?

Я пытался использовать этот код:

<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0.1/jquery.mobile-1.0.1.min.css" />
<script src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
<script src="http://code.jquery.com/mobile/1.0.1/jquery.mobile-1.0.1.min.js"></script>
<script type="text/javascript" src="js/knockout-2.0.0.debug.js"></script>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="apple-mobile-web-app-capable" content="yes">
<meta charset="utf-8" http-equiv="X-UA-Compatible" content="IE=9" />
<meta http-equiv="CACHE-CONTROL" content="NO-CACHE" />
</head>
<body>
Choose a company: <select id="companies" data-role="select" data-bind="options: companies,
optionsCaption: 'Choose...',
optionsText: 'companyName',
optionsValue: 'companyValue',
selectedOptions: chosencompanies" data-native-menu="false" multiple></select> 
<input data-bind="value: chosencompanies"></input>    
<script type="text/javascript">
$(document).ready(function () {
  function company(name, value) {
      this.name = ko.observable(name);
      this.value = ko.observable(value);
  }
  var viewModel = {
      companies: ko.observableArray([
              { companyName: "test", companyValue: 0 },
              { companyName: "test1", companyValue: 1 },
              { companyName: "test2", companyValue: 2 },
              { companyName: "test5", companyValue: 5 },
              { companyName: "test7", companyValue: 7 },
          ]),
      chosencompanies: ko.observableArray(),
      resetcompanies: function () { this.chosencompanies(null) }
  };
  ko.applyBindings(viewModel);

  $("#companies option").prop('selected', true);
  $("#companies").selectmenu();
  $("#companies").selectmenu('refresh', 'true');

});
</script>
</body>
</html>

Несмотря на то, что я использую $ ("опция # companies"). Prop ('selected', true) кажется, что only влияет на внешний вид выпадающего элемента управления а не с привязкой к данным selectedCompanies varialbe, что мне нужно установить? : (чье значение вы также можете видеть, поскольку оно привязано к данным в поле ввода под раскрывающимся списком) И прежде чем кто-либо предложит, пожалуйста, я понимаю, что мог бы инициализировать массив observableArray с помощью списка значений, разделенных запятыми, но что, когда мои параметры выбора динамический, и я не знаю, с какими значениями я должен preinit observableArray?

1012 * ТИА *

1 Ответ

0 голосов
/ 07 февраля 2012

Ваш select элемент связывает optionsValue с companyValue, поэтому, чтобы предварительно выбрать опцию, вы должны поместить значения компании в массив choosencompanies следующим образом:

var source = [
              { companyName: "test", companyValue: 0 },
              { companyName: "test1", companyValue: 1 },
              { companyName: "test2", companyValue: 2 },
              { companyName: "test5", companyValue: 5 },
              { companyName: "test7", companyValue: 7 },
          ];

var viewModel = {
      companies: ko.observableArray(source),
      chosencompanies: ko.observableArray([]),
      resetcompanies: function () { this.chosencompanies(null) }     
  };
  ko.applyBindings(viewModel);

for(var i = 0; i < source.length; i++) {    
   viewModel.chosencompanies.push(source[i].companyValue);
}

В этом случае после инициализации всех компанийбудет выбран предварительно, кроме «Выбрать компанию», а значения будут отображаться в текстовом поле, разделенном комой.

...