Javascript 在表单post上发送淘汰中选定项目的列表

假设我们使用Knockout并有一个

observearray

，我们将其加载到一个简单的html表中。此数组中的每个项都有一个复选框

在桌子的底部，我们有一个窗体和一个按钮。在表单post上，我们希望将所有选定项目的ID发送到服务器

我如何解决这个问题，从而避免一个基本的解决方案

我的想法：

选项1：

您可以在Knockout viewmodel中创建一个名为“OrderList”的字段，该字段迭代数组中的所有项，并构建一个逗号分隔的列表，该列表显示为隐藏字段，我们将其发布到服务器

选项2：

每次检查一个项目时，我们都在控制器上调用一个方法，该方法将其存储在服务器端

关于我想法的结论：

我觉得两种解决方案都不优雅。第一个有点复杂，第二个需要大量的服务器端通信

---

您通常如何以高效、干净的方式解决这个问题？

在我看来，使用绑定（这里使用

knockout

）的全部目的是拥有一个我们可以随时发送到服务器的结构，而无需额外的代码从接口获取数据

如果您不能做到这一点，我认为viewmodel和绑定需要一些更新

我必须说，我不使用带有

敲除功能的表单post，而是使用ajax调用，不发布页面/表单

使用ajax调用，例如使用
jQuery
，可以很容易地将viewmodel作为
JSON
对象发送：

$.ajax({ url: 'http://stackoverflow.com/...',
         data: ko.toJSON(yourModel),
         //other stuff
})

如果需要的话（如果表单中还没有您需要的元素），我想您可以使用包含viewmodel的
值
绑定来维护一个隐藏字段

回到你的问题上来
为什么不按原样发送整个ObservalArray，并解析数据服务器端以仅查找选定项

如果您喜欢以逗号分隔的列表形式发送数据，可以使用如下计算的可观测值：

var orderList = ko.computed(function () {
    var arr = myObservableArray();
    var ol = "";
    for (var i = 0; i < arr.length; i++)
        if (arr[i].isChecked) ol += (ol.length > 0 ? ";" : "") + arr[i].Id;
    return ol;
}

var orderList=ko.computed（函数（）{
var arr=myObservableArray（）；
var ol=“”；
对于（变量i=0；i0？；“：”）+arr[i].Id；
返回ol；
}

以您的形式：

<input type="hidden" data-bind="value: orderList" id="myOrderList" />



每次更新
observableARay
时，计算的可观测值都会更新

您可以阅读更多关于计算的可观测值的信息
我会在viewmodel中有一个可观测数组，比如“orderList”，它应该包含所选项目的ID。我在viewmodel“fillOrderList”中定义了一个函数。我会将所有复选框“checked”事件绑定到同一个函数“fillOrderList”。此函数的作用是[通过：
this.orderList.push（）
/
this.orderList.remove（）]推送或删除“orderList”中的相关行id[当然，您可以访问每行的id并在“fillOrderList”函数中使用它]

这样，当点击按钮时，您基本上不需要迭代或做任何事情，因为所选项目的ID在可观察数组“orderList”中已经可用-您可以将其传递给服务器，仅此而已

我希望这有帮助。
感谢您抽出时间展示多种解决方案。非常有用：）感谢您的输入：）也非常有用！