针对不同表格列

时间:2017-07-10 22:40:44

标签: javascript jquery asp.net knockout.js

我有三个名为Customer,Product和CustomerProduct的表。

我正试图在CustomerProduct中下载。下拉列表将包含Customer表中名为“Name”的列中的值。

客户表照片

enter image description here

问题是只有名字出现在下拉列表中,我有6个名字。我希望所有名字出现在下拉请帮助。

下拉照片

enter image description here

这是我的CustomerProduct控制器:

public ActionResult DropDownCustomerName() {
    var customerName = db.Customers.Select(x => new {
        customerName = x.Name,
        customerId = x.ID
    }).ToList();
    return this.Json(customerName, JsonRequestBehavior.AllowGet);
}

继承我的淘汰赛代码:

function CustomerProductDetails() {
    var self = this;
    self.customerProductArray = ko.observableArray([]);
    self.dropDownCustomerName = ko.observableArray([]);
    self.dropDownProductName = ko.observableArray([]);
    //List
    $.ajax({
        type: "Get",
        url: "/CustomerProduct/GetList",
        success: function (data) {
            $.each(data,
                function (index, data) {
                    self.customerProductArray.push(data);
                });
        }
    });

    //Add PopUp Model
    self.addCustomerProduct = function () {
        $('#addCustomerProduct').modal('show');
    }

    //Drop Down (Customer Name)
    $.ajax({
        type: "Get",
        url: "/CustomerProduct/DropDownCustomerName",
        success: function (data) {
            $.each(data,
                function (index, item) {
                    self.dropDownCustomerName.push(item);
                });
        }
    });

    //Drop Down (Product Name)
    $.ajax({
        type: "Get",
        url: "/CustomerProduct/DropDownProductName",
        success: function (data) {
            $.each(data,
                function (index, item) {
                    self.dropDownProductName.push(item);
                });
        }
    });

    //Save (Add)
    self.saveAdd = function () {
        var viewBindings = ko.toJS(this);
        var customerProductValues = viewBindings.addCustomerProduct;

        $.ajax({
            type: "Post",
            url: "/CustomerProduct/AddCustomerProduct",
            data: customerValues,
            success: function (result) {
                self.customerProductArray.push(result);
                $('#addCustomerProduct').modal('hide');
            }
        });
    }


}

ko.applyBindings(new CustomerProductDetails());

继承我观点的代码

<div id="addCustomerProduct" class="modal fade" role="dialog">
<div class="modal-dialog">

    <!-- Modal content-->
    <div class="modal-content">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal">&times;</button>
            <h4 class="modal-title">Modal Header</h4>
        </div>
        <div class="modal-body">

            <p>Customer Name: <select data-bind="options: $root.dropDownCustomerName, 
                                      value: customerName, optionsText: 'customerName'"></select></p>
            <p>Product Name: <select data-bind="options: $root.dropDownProductName, 
                                     value: productName, optionsText: 'productName'"></select></p>

        </div>
        <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            <button type="button" class="btn btn-info" data-bind="click:saveAdd">Save Changes</button>
        </div>
    </div>

</div>

0 个答案:

没有答案