Knockoutjs foreach n 行检查下拉菜单是否有价值答案

【问题标题】：Knockoutjs foreach n rows check if dropdown has valueKnockoutjs foreach n 行检查下拉菜单是否有价值
【发布时间】：2016-04-24 03:02:42
【问题描述】：

我有这个 html 标记：

<!-- ko foreach: Orders -->
  <div class="row">
    <div>
      <select class="form-control"  data-bind="attr: { id: 'prefix_' + $index() }, options: TeacherNames, optionsValue: 'TeacherId', optionsText: 'TeacherName', optionsCaption: 'Choose Teacher', event: { change: $root.teacherChanged }">
      </select>
    </div>
    <div>
      <a href='#' data-bind="click: $root.RequestImage" class="green-btn blue pull-right">
        <span class="glyphicon glyphicon-cloud-download"></span> Download 
      </a>
    </div>
  </div>
<!-- /ko -->

foreach 循环中将有 n 个项目，在开发时将不知道。

我想要做的是当单击 $root.RequestImage 时，代码需要检查是否在该行的相关下拉列表中进行了选择，如果进行了选择，则继续进行，否则显示警报框“错误”消息。

所以在 RequestImage 中应该发生的动作，这是当前的 RequestImage 函数：

self.RequestImage = function () {

};

我怎样才能做到这一点？

更新

订单虚拟机：

var self = this;
self.Orders = ko.observableArray([]);

$.ajax({
  type: "POST", url: "/webservices/InfoWS.asmx/GetOrders",
  contentType: "application/json; charset=utf-8",
  dataType: "json",
  success: function (data) {
    if (data.d != null) {
      var orderIds = [];
      ko.utils.arrayForEach(data.d, function (item) {

        item._teacherOrders = ko.observable();

        $.ajax({
          type: "POST",
          url: "/webservices/InfoWS.asmx/GetTeachersForMyAccount",
          contentType: "application/json; charset=utf-8",
          data: "{'orderId': " + JSON.stringify(item.OrderId) + "}",
          dataType: "json",
          success: function (data) {
            if (data) {
              return item._teacherOrders(data.d);
            }
          },
          error: function (n) {
            alert('Error retrieving teachers for orders, please try again.');
          }
        });

        item.TeacherNames = ko.computed(function () {
          return item._teacherOrders();
        });

        self.Orders.push(item);
        orderIds.push(item.OrderId);

      });
    }
  },
  error: function (data) {
    var response = JSON.parse(data.responseText);
    console.log("error retrieving orders:" + response.Message);
  }
});

【问题讨论】：

您能否提供 Orders VM，这样我在编写解决方案时就不必做出假设
@QBMS 请检查现在是否正常，谢谢您的帮助！
给我一些，正在处理中
感谢您选择的答案与我的答案完全相同，但细节较少，这家伙显然从我这里得到了我的答案。他甚至使用相同的变量名称？！
@QBM5，冷静点，这是巧合。当我看到你的回答时，我也很惊讶。

标签： javascript jquery knockout.js knockout-2.0 knockout-mvc

【解决方案1】：

我会这样做：

为每个订单对象添加一个可观察的selectedTeacher
将value: selectedTeacher 添加到您的选择中：

<select class="form-control" data-bind="attr: { id: 'prefix_' + $index() }, options: TeacherNames, optionsValue: 'TeacherId', ..., value: selectedTeacher"></select>

在您的 RequestImage 事件中检查该 observable

if ( !data.selectedTeacher() ) {
        alert('Error: select teacher')
} else {
        alert('Success')
}

一个工作演示 - Fiddle

【讨论】：

data.selectedTeacher 中的数据是什么？
它将是该行的 order 对象