1

我是 MVC 和淘汰赛的新手。请参考以下代码

控制器代码：

public string getJSON()
    {
        Product _objProduct = new Product();
        DataTable _objDT = _objProduct.getProduct();
        JavaScriptSerializer serializer = new JavaScriptSerializer();
        List<Dictionary<string, object>> rows = 
        new List<Dictionary<string, object>>();
        Dictionary<string, object> row = null;

        foreach (DataRow dr in _objDT.Rows)
        {
            row = new Dictionary<string, object>();
            foreach (DataColumn col in _objDT.Columns)
            {
                row.Add(col.ColumnName, dr[col]);
            }
            rows.Add(row);
        }
        return serializer.Serialize(rows);
    }

查看代码

<script>
$(document).ready(function () {
    $('#divheader').append("<h2>Please place an order</h2>");
    $.ajax({
        type: "Post",
        url: "/Order/getJSON",
        data: {},
        success: function (data) {

            function ReservationsViewModel() {
                var self = this;
                self.product = data;

                self.addOrder = function () {
                    alert('in');
                    self.order.push(new orderReservation());
                }
            }
            ko.applyBindings(new ReservationsViewModel());
        }
    });
});


<table>
<thead>
    <tr>
        <th>Product Name</th>
        <th>Quantity/Unit</th>
        <th>Unit Price</th>
        <th>Quanitity</th>
    </tr>
</thead>
<tbody>
    <tr>
        <td>
            <select id="ddlProduct"></select>
        </td>
        <td><label></label></td>
        <td><label></label></td>
    </tr>
</tbody>

我尝试了以下操作： <select id="ddlProduct" data-bind="options: ProductName"></select> 并且我的数据包含以下格式

[{"ProductID":1,"ProductName":Monitor},......]

它给出错误：Microsoft JScript 运行时错误：无法解析绑定。消息：[对象错误]；绑定值：选项：ProductName

任何想法，我要去哪里错了？

谁能告诉我如何使用敲除将 ajax 调用返回的数据绑定到 ddlProduct。

提前致谢

4

2 回答 2

0

假设您的服务器端脚本返回表单的有效 JSON：

[{"ProductID":1,"ProductName":Monitor},......]

你可以options binding在你的下拉列表中使用：

<select id="ddlProduct" data-bind="options: products, optionsValue: 'ProductID', optionsText: 'ProductName'"></select>

进而：

<script type="text/javascript">
    $(function () {
        $.ajax({
            type: 'POST',
            url: '@Url.Action("GetJSON", "Order")',
            success: function (data) {
                ko.applyBindings({ products: data });
            }
        });
    });
</script>

此外，您的控制器操作似乎一团糟。我会尝试改进一下：

public ActionResult GetJSON()
{
    var products = new Product()
        .getProduct()
        .AsEnumerable()
        .Select(row => new
        {
            ProductId = row.Field<int>("ProductId"),
            ProductName = row.Field<string>("ProductName")
        })
        .ToList();
    return Json(products);
}
于 2013-03-17T13:34:41.633 回答
0

你绑定到ReservationsViewModel，它没有ProductName。它有product，这似乎实际上是一系列产品。这似乎是您想要将您的选项绑定到（数组）的内容。

查看文档中的示例 3 。您正在绑定到一个对象列表，因此您需要结合使用 options 和 optionsText 来说明 name 属性是 ProductName。

所以是这样的：data-bind="options: product, optionsText: 'ProductName'"

于 2013-03-17T13:35:40.867 回答