0
我有問題加載兒童到我的選項列表。 我創建了一個訂單但我無法編輯。它不會加載下拉列表。 我的目標是當我按訂單上的編輯。在MVC中淘汰兒童的兒童加載/選項
它將在訂購項目的下拉列表中選擇當前產品。 我想從產品模型的價格（從下拉列表中選擇一個項目時）
是否有任何其他方式來填充下拉列表？
我會上傳圖片。
這是我的代碼javascript代碼。
var Products = [];
//fetch categories from database
function LoadProducts(element) {
if (Products.length == 0) {
//ajax function for fetch data
$.ajax({
type: "GET",
url: '/Sales/GetProducts',
success: function (data) {
Products = data;
//render catagory
renderProducts(element);
}
})
}
else {
alert("else");
//render catagory to the element
renderProducts(element);
}
}
function renderProducts(element) {
var $ele = $(element);
$ele.empty();
$ele.append($('<option/>').val('0').text('Select'));
$.each(Products, function (i, val) {
$ele.append($('<option/>').val(val.ProductId).text(val.ProductName));
})
}
var Seats = [];
//fetch categories from database
function LoadSeats(element) {
if (Seats.length == 0) {
//ajax function for fetch data
$.ajax({
type: "GET",
url: '/Sales/GetSeats',
success: function (data) {
Seats = data;
//render catagory
renderSeats(element);
}
})
}
else {
//render catagory to the element
renderSeats(element);
}
}
function renderSeats(element) {
var $ele = $(element);
$ele.empty();
$ele.append($('<option/>').val('0').text('Select'));
$.each(Seats, function (i, val) {
$ele.append($('<option/>').val(val.SeatId).text(val.SeatPlace));
})
}
var Employees = [];
//fetch categories from database
function LoadEmployees(element) {
if (Employees.length == 0) {
//ajax function for fetch data
$.ajax({
type: "GET",
url: '/Sales/GetEmployees',
success: function (data) {
Employees = data;
//render catagory
renderEmployees(element);
}
})
}
else {
//render catagory to the element
renderEmployees(element);
}
}
function renderEmployees(element) {
var $ele = $(element);
$ele.empty();
$ele.append($('<option/>').val('0').text('Select'));
$.each(Employees, function (i, val) {
$ele.append($('<option/>').val(val.EmployeeId).text(val.EmployeeName));
})
}
var PaymentMethods = [];
//fetch categories from database
function LoadPaymentMethods(element) {
if (PaymentMethods.length == 0) {
//ajax function for fetch data
$.ajax({
type: "GET",
url: '/Sales/GetPaymentMethods',
success: function (data) {
PaymentMethods = data;
//render catagory
renderPaymentMethods(element);
}
})
}
else {
//render catagory to the element
renderPaymentMethods(element);
}
}
function renderPaymentMethods(element) {
var $ele = $(element);
$ele.empty();
$ele.append($('<option/>').val('0').text('Select'));
$.each
(PaymentMethods, function (i, val) {
$ele.append
($('<option/>')
.val(val.PaymentMethodId)
.text(val.PaymentMethodType));
})
}
var ObjectState = {
Unchanged: 0,
Added: 1,
Modified: 2,
Deleted: 3
};
LoadProducts($('#productCategory'));
var salesOrderItemMapping = {
'SalesOrderItems': {
key: function (salesOrderItem) {
// alert("Salesorderitem mapping key");
return ko.utils.unwrapObservable(salesOrderItem.SalesOrderItemId);
},
create: function (options) {
console.log(options);
return new SalesOrderItemViewModel(options.data);
}
}
};
//var productItemMapping = {
// 'Products': {
// key: function(product) {
// return ko.utils.unwrapObservable(product.ProductId);
// },
// create: function(options) {
// return new SalesOrderViewModel(options.data);
// }
// }
//};
// ko.mapping.fromJS(data, productItemMapping, SalesOrderViewModel);
SalesOrderItemViewModel = function (data) {
//alert("salesorder item view"); // funkade
var self = this;
ko.mapping.fromJS(data, salesOrderItemMapping, self);
//dd: ko.observableArray(Products);
self.itemss = ko.observableArray(Products);
self.selectedItem = ko.observable(Products.ProductId);
//self.product1 = ko.observableArray(Products());
//self.dd = ko.observableArray(function() {
// //data.ProductId = data.Products.ProductId;
// return self.Products();
//});
self.flagSalesOrderAsEdited = function() {
if (self.ObjectState() !== ObjectState.Added) {
self.ObjectState(ObjectState.Modified);
}
// alert("salesorder item view if");
return true;
};
};
SalesOrderViewModel = function (data) {
var self = this;
ko.mapping.fromJS(data, salesOrderItemMapping, self);
//alert("salesorder view model"); // funkade
self.save = function() {
$.ajax({
url: "/Sales/Save/",
type: "POST",
data: ko.toJSON(self),
contentType: "application/json",
success: function (data) {
if (data.salesOrderViewModel !== null)
ko.mapping.fromJS(data.salesOrderViewModel, {}, self);
if (data.newLocation !== null)
window.location = data.newLocation;
}
});
},
self.flagSalesOrderAsEdited = function() {
if (self.ObjectState() !== ObjectState.Added) {
self.ObjectState(ObjectState.Modified);
}
return true;
},
self.deleteSalesOrderItem = function(salesOrderItem) {
self.SalesOrderItems.remove(this);
if (salesOrderItem.SalesOrderItemId() > 0 &&
self.SalesOrderItemsToDelete.indexOf
(salesOrderItem.SalesOrderItemId()) === -1)
self.SalesOrderItemToDelete.push(SalesOrderItemId());
}
self.addSalesOrderItem = function() {
// alert(" add salesorder item"); // funkade
var salesOrderItem = new SalesOrderItemViewModel(
{ SalesOrderItemId: 0, ProductId: 1, Quantity: 1,
ObjectState: ObjectState.Added });
self.SalesOrderItems.push(salesOrderItem);
};
};
//UnitPrice: 1
LoadSeats($('#SeatId'));
LoadEmployees($('#EmployeeId'));
LoadPaymentMethods($('#PaymentMethodId'));
這是我的編輯部分視圖。
<table class="table table-striped">
<tr>
<th>Product Name</th>
<th>Quantity</th>
@*<th>Unit Price</th>*@
<th><button class="btn btn-info btn-xs"
data-bind="click: addSalesOrderItem">Add</button></th>
</tr>
<tbody data-bind="foreach: SalesOrderItems">
<tr>
<td>
@*<select id="productCategory" class="pc form-control"
data-bind="value: ProductId">
<option>Select</option>
</select>*@
@*<select data-bind="options: $parent.product1,
optionsText: 'ProductName', optionsValue: 'ProductId',
value: ProductId"></select>*@
<select data-bind=
"options: itemss, optionsText: 'ProductName',
value: ProductId, optionsValue: 'ProductId',
selectedOption: selectedOption"> </select>
</td>
@*<td class="form-group">
<input class="form-control input-sm" data-bind="value: ProductId" /></td>*@
<td class="form-group">
<input class="form-control input-sm" data-bind="value: Quantity"/></td>
@*<td class="form-group">
<input class="form-control input-sm" data- bind="text: UnitPrice"/></td>*@
<td class="form-group">Delete</td>
</tr>
</tbody>
</table>
這是當我創建 
這是當我編輯的順序 
而且我得到這個問題，當我保存 
我有問題將孩子加載到我的選項列表中。 我創建了一個訂單但我無法編輯。它不會加載下拉列表。 我的目標是當我按訂單上的編輯。
它將在訂購項目的下拉列表中選擇當前產品。 我想把產品型號的價格放到視圖中（當從下拉列表中選擇一個項目時） 我會上傳圖片。
我想走一條路。我是knockout/mvc的新手，我無法找到映射示例。我會appipatiate任何feedpack或步驟，我可以使用。 如果您需要更多，請寫下。
謝謝!!!
這是我創建視圖BTW（它是如何連接到淘汰賽）
@model TheSolution.Domain.viewModels.SalesOrderViewModel
@using System.Web.Script.Serialization
@{
ViewBag.Title = "Create Sales Order";
}
@{
string data = new JavaScriptSerializer().Serialize(Model);
}
@section scripts
{
<script src="~/Scripts/knockout-3.4.0.js"></script>
<script src="~/Scripts/knockout.mapping-latest.js"></script>
<script src="~/Scripts/salesorderviewmodel.js"></script>
<script type="text/javascript">
var salesOrderViewModel = new SalesOrderViewModel(@Html.Raw(data));
ko.applyBindings(salesOrderViewModel);
</script>
}
@Html.Partial("_EditSalesOrder");