0

私は 2 つの値を含むモデルにバインドされた単純な選択コントロールを持っています: id - 選択したインデックスにバインドしたい値と、ooptions を入力したい都市 = 配列。ここにJSがあります：

    var VM=function ViewModel() {
      self=this;


        this.id = ko.observable(102);
        this.cities=ko.observableArray([]); 

        this.getCities=function(){ 
              self.cities( [{"Key":"-1","Value":"choose city"},{"Key":"100","Value":"leningrad"},   {"Key":"102","Value":"moscow"}]); 
        } ;
    }

    var vm=new VM();
    ko.applyBindings(vm);

ユーザーがボタンをクリックした後に都市を設定したいのですが、選択した都市はモスクワのままでなければなりません (最初は「id」が 102 だったため)

ここに私のHTMLがあります:

    <!DOCTYPE html>
    <html>
    <head>
    <script src="http://cloud.github.com/downloads/SteveSanderson/knockout/knockout-2.1.0.js"></script>
    <meta charset=utf-8 />
    <title>JS Bin</title>
    </head>
    <body>
      <select data-bind="options:cities,optionsText:'Value',optionsValue:'Key',value:id"></select>

      <button data-bind="click:getCities">get cities</button>
    </body>
    </html>

私の問題は、都市がロードされた後に選択したインデックスが失われたことです 助けてください ありがとう

4

1 に答える 1

0

私の問題がどこにあるのかを突き止めました。「値」バインディングは双方向であるため、最初にオプションなしで選択するようにバインドされたとき、「id」は -1 になりました。私が変更したとき：

  <select data-bind="options:cities,optionsText:'Value',optionsValue:'Key'"></select>

そして追加しました：

    this.getCities=function(){ 
          self.cities( [{"Key":"-1","Value":"choose city"},{"Key":"100","Value":"leningrad"},   {"Key":"102","Value":"moscow"}]
                     ); 


      $('select').val(self.id());
    } ;

物事はうまくいき始めましたが、今の問題は、selectが入力された後にユーザーが都市を選択した場合に値を収集する方法です:私の解決策は、控えめなjqueryハンドラにselectの変更を添付することです:

          var VM=function ViewModel() {
          self=this;


            this.id = ko.observable(102);
            this.cities=ko.observableArray([]); 

            this.getCities=function(){ 
                  self.cities( [{"Key":"-1","Value":"choose city"},{"Key":"100","Value":"leningrad"},   {"Key":"102","Value":"moscow"}]
                             ); 


              $('select').val(self.id());
            } ;



        };
    var f=function(){
      vm.id($('select').val())



    }
        var vm=new VM();
        ko.applyBindings(vm);
    $('select').change(f)

私の問題を経験した人に役立つことを願っています...

于 2012-12-17T17:04:39.720 に答える