如何根据用户选择更新我的税

时间:2016-03-25 19:49:36

标签: javascript jquery knockout.js

我正在试图弄清楚当用户选择特定州时如何更新我的税率。这是我的代码(删除不相关的数据):

$(this).find('.collapse li label').text();
<select data-bind="event: {change: checkTax }">
    <option value="PA">PA</option>
    <option value="FL">FL</option>
</select>

<span data-bind="text: taxedItems"></span>

首先var MainViewModel = function() { var self = this; var response = arrayFromJson; // ... self.checkTax = function (viewModel, event) { if (event.target.value === "FL") { userTax = "this should appear"; } }; self.taxedItems = ko.pureComputed(function() { taxcost = userTax; return taxcost; }); self.CartItems($.map(response, function(item) { return new AppViewModel(item); })); }; function AppViewModel(data) { var self = this; // ... } ko.applyBindings(new MainViewModel()); 应该为空,然后在用户将其更改为taxedItems后,FL应该说taxedItems,但它不会绕过更新{{} 1}}完全。有谁知道这是为什么?

1 个答案:

答案 0 :(得分:1)

如果你想在mainViewModel中使用taxedItems,你可以这样做:
VM:

 var MainViewModel = function () {
    var self = this;
    self.CartItems = ko.observableArray([]);
    self.States = ko.observableArray([{Value:"CA",Name:"CA"},
                                      {Value:"FL",Name:"FL"},
                                      {Value:"NY",Name:"NY"},
                                      {Value:"VG",Name:"VG"},
                                      {Value:"TX",Name:"TX"}
                                    ]);

    var response = [{ }];
    self.CartItems($.map(response, function (item) {
      return new AppViewModel(item);
    }));


    self.TaxedItems = ko.observable();
    self.SelectedState = ko.observable(0);

    self.SelectedState.subscribe(function (StateValue) {
        if(StateValue ==='FL'){
            self.TaxedItems('this should appear');
        }else{
           self.TaxedItems('');
        }
    })
  }

  function AppViewModel(data) {
    var self = this;
    // ...
}

  ko.applyBindings(new MainViewModel());

查看:

<select data-bind="foreach: States ,value:SelectedState">
<option data-bind="visible:$index()==0" value="0" disabled>Select Tax State..</option>
  <option data-bind="value: Value,text:Name"></option>
</select>
<br>

<span data-bind="text: TaxedItems"></span>

示例:http://jsfiddle.net/GSvnh/5095/