Question

我有这个选择控件，通过knockoutjs获取数据：

 t.AddToCart = function (n) {
           if (!t.Busy()) {
               t.Busy(!0);
               n.Processing(!0);
               var i = t.SelectedColor();
               if (t.selectedItem()) {
                   $.ajax({
                       type: "POST",
                       url: "/webservices/ShopCartWS.asmx/AddItem",
                       data: "{'packId': " + n.Id + ", 'teacherId': " + t.selectedItem() + " }",
                       contentType: "application/json; charset=utf-8",
                       dataType: "json",
                       success: function (i) {
                           if (i.d) {
                               $("#cart-status").sticky();
                               var r = i.d;
                               f(r);
                               n.Processing(!13);
                               t.Busy(!13);
                           }
                       },
                       error: function (n) {
                           u(n);
                       }
                   });
               } else {
                   alert('Choose Teacher First');
                   t.Busy(0);
                   n.Processing(0);
               }
           }
       };

现在发生的事情是，例如，如果我在列表的一个下拉列表中选择一个值，则foreach列表中的所有其他下拉列表将自动获得相同的值。

是否可以更改功能，以便只有选中的下拉列表才会更改值？

当前功能的短视频https://i.gyazo.com/1d70b77210e1daf3b14dc29a24bb01e4.gif

添加了更多代码（这是我使用实际下拉值的地方）：

   t._teacherOptions = ko.observable();

               function getTeacherList() {
                   $.ajax({
                       type: "POST",
                       url: "/webservices/Teachers.asmx/GetTeachers",
                       contentType: "application/json; charset=utf-8",
                       dataType: "json",
                       success: function (i) {
                           if (i.d) {
                               return t._teacherOptions(i.d);

                           }
                       },
                       error: function (n) {
                           u(n);
                       }
                   });
               }

               getTeacherList();

               t.TeacherOptions = ko.computed(function () {
                   return t._teacherOptions();
               });

我如何获得价值观：

r_query = "SELECT MAX(column)
            FROM user_checklist 
            INNER JOIN rooms 
            ON user_checklist.RID = rooms.ID 
            INNER JOIN buildings 
            ON rooms.BID = buildings.ID 
            INNER JOIN tb inspectors 
            ON user_checklist.INSPID = inspectors.ID 
            GROUP BY user_checklist.cdate, user_checklist.rid";

            if(StructKeyExists(date_key, "expression") AND StructKeyExists(date_key, "value"))
            {
                r_query &= " HAVING #date_key.expression# '#date_key.value#'";
            }

Answer 1

如果您希望不同的选择能够具有不同的值，则需要为其value绑定提供不同的可观察对象。看起来你在foreach内创建了这些选择，所以代替$root.selectedItem，它只是一个变量，在你循环的每个元素中都有一个变量。

function TeacherOption(name, id) {
  return {
    TeacherName: name,
    TeacherId: id
  };
}

vm = {
  TeacherOptions: ko.observableArray([
    TeacherOption('one', 1),
    TeacherOption('two', 2),
    TeacherOption('pi', 3)
  ]),

  selectors: [{
    selectedItem: ko.observable()
  }, {
    selectedItem: ko.observable()
  }]
};

ko.applyBindings(vm);

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script>
<div data-bind="foreach: selectors">
  <select class="form-control" data-bind="value: selectedItem, options: $root.TeacherOptions(), optionsValue: 'TeacherId', optionsText: 'TeacherName', optionsCaption: 'Choose Teacher'"></select>
</div>

knockoutjs foreach数组选择项值绑定

1 个答案: