请问我是按照api 上面的例子写的,麻烦问一下为什么会报错呢,谢谢
<!DOCTYPE html>
<html>
<head>
<title></title>
<link href="css/jquery.wijmo.wijspread.3.20143.14.css" rel="stylesheet" />
<script src="external/jquery-1.8.2.min.js"></script>
<!--SpreadJS pluggable core function library-->
<script src="external/globalize.min.js"></script>
<script src="external/knockout-2.1.0.debug.js"></script>
<script src="external/knockout-2.1.0.js"></script>
<script src="external/knockout-2.1.0.js"></script>
<script src="external/jquery-ui-1.9.1.custom.min.js"></script>
<script src="scripts/jquery.wijmo.wijspread.all.3.20143.14.js"></script>
<script>
$(function () {
});
var viewModel;
function sourceData() {
return [
{ "roduct_ID": 1, "Supplier_ID": 1, "Category_ID": 1, "roduct_Name": "Chai", "English_Name": "Dharamsala Tea", "Quantity_Per_Unit": "10 boxes x 20 bags", "Unit_Price": 18.0, "Units_In_Stock": 39, "Units_On_Order": 0, "Reorder_Level": 10, "Discontinued": false }, { "roduct_ID": 2, "Supplier_ID": 1, "Category_ID": 1, "roduct_Name": "Chang", "English_Name": "Tibetan Barley Beer", "Quantity_Per_Unit": "24 - 12 oz bottles", "Unit_Price": 19.0, "Units_In_Stock": 17, "Units_On_Order": 40, "Reorder_Level": 25, "Discontinued": false }, { "roduct_ID": 24, "Supplier_ID": 10, "Category_ID": 1, "roduct_Name": "Guaraná Fantástica", "English_Name": "Guaraná Fantástica Soft Drink", "Quantity_Per_Unit": "12 - 355 ml cans", "Unit_Price": 4.5, "Units_In_Stock": 20, "Units_On_Order": 0, "Reorder_Level": 0, "Discontinued": true }, { "roduct_ID": 34, "Supplier_ID": 16, "Category_ID": 1, "roduct_Name": "Sasquatch Ale", "English_Name": "Sasquatch Ale", "Quantity_Per_Unit": "24 - 12 oz bottles", "Unit_Price": 14.0, "Units_In_Stock": 111, "Units_On_Order": 0, "Reorder_Level": 15, "Discontinued": false }, { "roduct_ID": 35, "Supplier_ID": 16, "Category_ID": 1, "roduct_Name": "Steeleye Stout", "English_Name": "Steeleye Stout", "Quantity_Per_Unit": "24 - 12 oz bottles", "Unit_Price": 18.0, "Units_In_Stock": 20, "Units_On_Order": 0, "Reorder_Level": 15, "Discontinued": false }, { "Product_ID": 38, "Supplier_ID": 18, "Category_ID": 1, "Product_Name": "Côte de Blaye", "English_Name": "Côte de Blaye (Red Bordeaux wine)", "Quantity_Per_Unit": "12 - 75 cl bottles", "Unit_Price": 263.5, "Units_In_Stock": 17, "Units_On_Order": 0, "Reorder_Level": 15, "Discontinued": false }, { "Product_ID": 39, "Supplier_ID": 18, "Category_ID": 1, "Product_Name": "Chartreuse verte", "English_Name": "Green Chartreuse (Liqueur)", "Quantity_Per_Unit": "750 cc per bottle", "Unit_Price": 18.0, "Units_In_Stock": 69, "Units_On_Order": 0, "Reorder_Level": 5, "Discontinued": false }, { "Product_ID": 43, "Supplier_ID": 20, "Category_ID": 1, "Product_Name": "Ipoh Coffee", "English_Name": "Malaysian Coffee", "Quantity_Per_Unit": "16 - 500 g tins", "Unit_Price": 46.0, "Units_In_Stock": 17, "Units_On_Order": 10, "Reorder_Level": 25, "Discontinued": false }, { "Product_ID": 67, "Supplier_ID": 16, "Category_ID": 1, "Product_Name": "Laughing Lumberjack Lager", "English_Name": "Laughing Lumberjack Lager", "Quantity_Per_Unit": "24 - 12 oz bottles", "Unit_Price": 14.0, "Units_In_Stock": 52, "Units_On_Order": 0, "Reorder_Level": 10, "Discontinued": false }, { "Product_ID": 70, "Supplier_ID": 7, "Category_ID": 1, "Product_Name": "Outback Lager", "English_Name": "Outback Lager", "Quantity_Per_Unit": "24 - 355 ml bottles", "Unit_Price": 15.0, "Units_In_Stock": 15, "Units_On_Order": 10, "Reorder_Level": 30, "Discontinued": false }, { "Product_ID": 75, "Supplier_ID": 12, "Category_ID": 1, "Product_Name": "Rhönbräu Klosterbier", "English_Name": "Rhönbräu Beer", "Quantity_Per_Unit": "24 - 0.5 l bottles", "Unit_Price": 7.75, "Units_In_Stock": 125, "Units_On_Order": 0, "Reorder_Level": 25, "Discontinued": false }, { "Product_ID": 76, "Supplier_ID": 23, "Category_ID": 1, "Product_Name": "Lakkalikööri", "English_Name": "Cloudberry Liqueur", "Quantity_Per_Unit": "500 ml", "Unit_Price": 18.0, "Units_In_Stock": 57, "Units_On_Order": 0, "Reorder_Level": 20, "Discontinued": false },
{ "Product_ID": 3, "Supplier_ID": 1, "Category_ID": 2, "Product_Name": "Aniseed Syrup", "English_Name": "Licorice Syrup", "Quantity_Per_Unit": "12 - 550 ml bottles", "Unit_Price": 10.0, "Units_In_Stock": 13, "Units_On_Order": 70, "Reorder_Level": 25, "Discontinued": false }, { "Product_ID": 4, "Supplier_ID": 2, "Category_ID": 2, "Product_Name": "Chef Anton's Cajun Seasoning", "English_Name": "Chef Anton's Cajun Seasoning", "Quantity_Per_Unit": "48 - 6 oz jars", "Unit_Price": 22.0, "Units_In_Stock": 53, "Units_On_Order": 0, "Reorder_Level": 0, "Discontinued": false }, { "Product_ID": 5, "Supplier_ID": 2, "Category_ID": 2, "Product_Name": "Chef Anton's Gumbo Mix", "English_Name": "Chef Anton's Gumbo Mix", "Quantity_Per_Unit": "36 boxes", "Unit_Price": 21.35, "Units_In_Stock": 0, "Units_On_Order": 0, "Reorder_Level": 0, "Discontinued": true }, { "Product_ID": 6, "Supplier_ID": 3, "Category_ID": 2, "Product_Name": "Grandma's Boysenberry Spread", "English_Name": "Grandma's Boysenberry Spread", "Quantity_Per_Unit": "12 - 8 oz jars", "Unit_Price": 25.0, "Units_In_Stock": 120, "Units_On_Order": 0, "Reorder_Level": 25, "Discontinued": false }, { "Product_ID": 8, "Supplier_ID": 3, "Category_ID": 2, "Product_Name": "Northwoods Cranberry Sauce", "English_Name": "Northwoods Cranberry Sauce", "Quantity_Per_Unit": "12 - 12 oz jars", "Unit_Price": 40.0, "Units_In_Stock": 6, "Units_On_Order": 0, "Reorder_Level": 0, "Discontinued": false }, { "Product_ID": 15, "Supplier_ID": 6, "Category_ID": 2, "Product_Name": "Genen Shouyu", "English_Name": "Lite Sodium Soy Sauce", "Quantity_Per_Unit": "24 - 250 ml bottles", "Unit_Price": 15.5, "Units_In_Stock": 39, "Units_On_Order": 0, "Reorder_Level": 5, "Discontinued": false }, { "Product_ID": 44, "Supplier_ID": 20, "Category_ID": 2, "Product_Name": "Gula Malacca", "English_Name": "Malacca Dark Brown Sugar", "Quantity_Per_Unit": "20 - 2 kg bags", "Unit_Price": 19.45, "Units_In_Stock": 27, "Units_On_Order": 0, "Reorder_Level": 15, "Discontinued": false }, { "Product_ID": 61, "Supplier_ID": 29, "Category_ID": 2, "Product_Name": "Sirop d'érable", "English_Name": "Maple Syrup", "Quantity_Per_Unit": "24 - 500 ml bottles", "Unit_Price": 28.5, "Units_In_Stock": 113, "Units_On_Order": 0, "Reorder_Level": 25, "Discontinued": false }, { "Product_ID": 63, "Supplier_ID": 7, "Category_ID": 2, "Product_Name": "Vegie-spread", "English_Name": "Vegetable Sandwich Spread", "Quantity_Per_Unit": "15 - 625 g jars", "Unit_Price": 43.9, "Units_In_Stock": 24, "Units_On_Order": 0, "Reorder_Level": 5, "Discontinued": false }, { "Product_ID": 65, "Supplier_ID": 2, "Category_ID": 2, "Product_Name": "Louisiana Fiery Hot Pepper Sauce", "English_Name": "Louisiana Fiery Hot Pepper Sauce", "Quantity_Per_Unit": "32 - 8 oz bottles", "Unit_Price": 21.05, "Units_In_Stock": 76, "Units_On_Order": 0, "Reorder_Level": 0, "Discontinued": false }, { "Product_ID": 66, "Supplier_ID": 2, "Category_ID": 2, "Product_Name": "Louisiana Hot Spiced Okra", "English_Name": "Louisiana Hot Spiced Okra", "Quantity_Per_Unit": "24 - 8 oz jars", "Unit_Price": 17.0, "Units_In_Stock": 4, "Units_On_Order": 100, "Reorder_Level": 20, "Discontinued": false }, { "Product_ID": 77, "Supplier_ID": 12, "Category_ID": 2, "Product_Name": "Original Frankfurter grüne Soße", "English_Name": "Original Frankfurter Green Sauce", "Quantity_Per_Unit": "12 boxes", "Unit_Price": 13.0, "Units_In_Stock": 32, "Units_On_Order": 0, "Reorder_Level": 15, "Discontinued": false }
];
}
function ViewModel(sessionId) {
var self = this;
this.currentPositionChangedhandler = function (context) {
self.activeProduct(self.products.currentItem());
};
//ArrayDataView is a js type which implement IDataView Interface.
var productView = new wijmo.data.ArrayDataView(sourceData()); //, {pageSize: 10});
this.products = productView;
this.products.currentPosition(0);
this.products.currentPosition.subscribe(this.currentPositionChangedhandler, null, null);
this.activeProduct = ko.observable(this.products.currentItem());
//IDataView Filter function.
this.clearFilter = function () {
productView.filter(null);
};
this.filterBeverages = function () {
productView.filter({ Category_ID: 1 });
};
this.filterCondiments = function () {
productView.filter({ Category_ID: 2 });
};
//IDataView Sort function.
this.sortId = function () {
productView.sort("Product_ID");
};
this.sortPrice = function () {
productView.sort("Unit_Price desc, Product_Name");
};
//IDataView Paging function
this.clearPaging = function () {
productView.pageSize(0);
};
this.setPaging = function () {
productView.pageSize(10);
};
this.prevPage = function () {
productView.prevPage();
};
this.nextPage = function () {
productView.nextPage();
};
//IDataView Add function.
this.add = function () {
productView.add({
Product_ID: 100,
Product_Name: "Tomato",
Category_ID: 1,
Unit_Price: 5
});
productView.commitEdit();
};
//IDataView Delete function.
this.deleteCurrent = function () {
productView.remove();
};
//IDataView Edit Value in source function.
this.doublePrice = function () {
productView.editItem();
productView.currentEditItem().Unit_Price *= 2;
productView.commitEdit();
};
}
$(document).ready(function () {
if (!viewModel) viewModel = new ViewModel();
ko.applyBindings(viewModel);
});
</script>
</head>
<body>
<div id="ss" data-bind="wijspread: { sheetCount:1,
activeSheetIndex:0,
tabEditable:false,
newTabVisible:false,
sheets:[
{
data: products, columns: [
{ displayName: 'ID', name: 'Product_ID', width:60 },
{ displayName: 'Product name', name: 'Product_Name', width:260 },
{ displayName: 'Category ID', name: 'Category_ID', width:100 },
{ displayName: 'Price', name: 'Unit_Price', width:60 }
]
}
]
}" style="width:850px; height:300px; border: 1px solid black;"></div>
<button data-bind="click:clearPaging">pageSize = 0</button>
<button data-bind="click:setPaging">pageSize = 10</button>
<button data-bind="click:prevPage">prev</button>
<button data-bind="click:nextPage">next</button>
</body>
</html> |
|