C# 从ViewModel中的列表中选择列表,显示选项为";[对象窗口]”;

C# 从ViewModel中的列表中选择列表,显示选项为";[对象窗口]”;,c#,asp.net-mvc,knockout.js,C#,Asp.net Mvc,Knockout.js,我想在我的视图上创建一个选择列表,允许客户从该选择列表中选择客户 我的视图模型如下所示: public int SalesOrderId { get; set; } public int CustomerId { get; set; } public string PONumber { get; set; } public DateTime OrderDate { get; set; } public List<Customer> Customers { get; set; } p

我想在我的视图上创建一个选择列表,允许客户从该选择列表中选择客户

我的视图模型如下所示:

public int SalesOrderId { get; set; }
public int CustomerId { get; set; }
public string PONumber { get; set; }
public DateTime OrderDate { get; set; }

public List<Customer> Customers { get; set; }
public List<SalesOrderItemViewModel> SalesOrderItems { get; set; }
public int CustomerId { get; set; }
public string CustomerName { get; set; }
SalesOrderViewModel = function (data) {
    var self = this;
    // This automatically creates my view model properties for ko from my view model passed from the server
    ko.mapping.fromJS(data, salesOrderItemMapping, self);

    // .... Other save functions etc.
};
我的淘汰赛js如下所示:

public int SalesOrderId { get; set; }
public int CustomerId { get; set; }
public string PONumber { get; set; }
public DateTime OrderDate { get; set; }

public List<Customer> Customers { get; set; }
public List<SalesOrderItemViewModel> SalesOrderItems { get; set; }
public int CustomerId { get; set; }
public string CustomerName { get; set; }
SalesOrderViewModel = function (data) {
    var self = this;
    // This automatically creates my view model properties for ko from my view model passed from the server
    ko.mapping.fromJS(data, salesOrderItemMapping, self);

    // .... Other save functions etc.
};
[编辑] 按要求进行销售项目映射

var salesOrderItemMapping = {
    'SalesOrderItems': {
        // key for each child
        key: function (salesOrderItem) {
            return ko.utils.unwrapObservable(salesOrderItem.SalesOrderItemId);
        },
        // Tell knockout what to fo for each sales order item it needs to create
        create: function (options) {
            // create a new sales order item view model using the model passed to the mapping definition
            return new SalesOrderItemViewModel(options.data); // Notice data is a property of the options object
            // Moreover, data is the data for this child and options is the object containing the parent
        }
    }
};
[编辑] @Html.Raw(数据)按要求:

{"SalesOrderId":1,"CustomerId":1,"PONumber":"123456","OrderDate":"2015-01-25T00:00:00","MessageToClient":"The original value of Customer Name is Ashfield Clutch Services.","ObjectState":0,"Customer":{"CustomerId":1,"CustomerName":"Ashfield Clutch Services"},"SalesOrderItems":[{"SalesOrderItemId":1,"ProductCode":"ABC","Quantity":10,"UnitPrice":1.23,"SalesOrderId":1,"ObjectState":0},{"SalesOrderItemId":2,"ProductCode":"XYZ","Quantity":7,"UnitPrice":14.57,"SalesOrderId":1,"ObjectState":0},{"SalesOrderItemId":3,"ProductCode":"SAMPLE","Quantity":3,"UnitPrice":15.00,"SalesOrderId":1,"ObjectState":0}],"SalesOrderItemsToDelete":[],"Customers":[{"CustomerId":1,"CustomerName":"Ashfield Clutch Services"},{"CustomerId":3,"CustomerName":"Davcom-IT Ltd"},{"CustomerId":2,"CustomerName":"Fluid Air Conditioning"}]} 
在我的观点的顶部,我有一个js:

<script src="~/Scripts/salesOrderViewModel.js"></script>
<script type="text/javascript">
    var salesOrderViewModel = new SalesOrderViewModel(@Html.Raw(data));
    ko.applyBindings(salesOrderViewModel);
</script>

您可以看到,它没有显示客户,而是为所有客户显示“
[object Window]
”。我认为这可能是一半,因为它显示了“
[object Window]
”的正确数量与数据库中客户端的数量之比

我知道客户必须是一个可观测的阵列,但我不确定如何将其应用到我的js视图模型中


任何帮助都将不胜感激。

您需要在将客户绑定到“选择”下拉列表时进行一次更改

你的现有代码

<select class="form-control" name="Customers" id="Customers" data-bind="options: Customers, optionsText: CustomerName, optionsValue: CustomerId, value: CustomerId"></select>

做出以下改变

<select class="form-control" name="Customers" id="Customers" data-bind="options: salesOrderViewModel.Customers, optionsText: Customers.CustomerName, optionsValue: Customers.CustomerId, value: CustomerId"></select>

选项:salesOrderViewModel.Customers

它应该适合您。

选项文本和选项值中是否缺少“”

<select class="form-control" name="Customers" id="Customers" data-bind="options: Customers, optionsText: "CustomerName", optionsValue: "CustomerId", value: CustomerId"></select>


Customer类中的所有属性是什么?现在只需:
int CustomerId{get;set;}
string CustomerName{get;set;}
当您从服务器获取值时,会给客户带来什么?它可能类似于data.Customers。我向您询问了customer类的属性,因为当服务器的属性名称与Select中的附加值不匹配时会出现对象错误。在将视图模型返回到视图之前,我会从存储库在控制器中填充客户。因此,实际上视图模型包含当前销售订单、其所有子销售订单实体和客户集合。它不能是数据。客户,因为我们在绑定到选择列表时不再使用js函数,所以此时数据未定义。所以dio您的意思是客户是ko.applyBindings(salesOrderViewModel)的salesOrderViewModel的一部分;谢谢Dnyanesh,这没用。我按照建议进行了更改,现在Firefox中的页面没有完全加载,js控制台显示ReferenceError错误:CustomerName未定义。我担心这也不起作用。虽然选择列表现在有一个集合[object object],而不是以前的集合[object Window]。谢谢你的帮忙,谢谢。你的回答让我明白了80%的道理,但就这个问题而言,我想这是正确的答案。您的回答显示了询问的客户,但与salesOrderViewModel的绑定不起作用<
数据绑定
中的code>值应该是
salesOrderViewMode.CustomerId
,而不仅仅是
CustomerId
。谢谢你的帮助。填写: