Asp.net mvc 4 包含knockoutjs、requirejs和mvc4的Jquery数据表
我正在使用Knockoutjs、requirejs和mvc4构建一个web应用程序 要在数据表中显示的公司列表 我的Common.js如下所示:Asp.net mvc 4 包含knockoutjs、requirejs和mvc4的Jquery数据表,asp.net-mvc-4,knockout.js,requirejs,Asp.net Mvc 4,Knockout.js,Requirejs,我正在使用Knockoutjs、requirejs和mvc4构建一个web应用程序 要在数据表中显示的公司列表 我的Common.js如下所示: require.config({ baseUrl: "/Scripts/", paths: { "jquery": "jquery-1.8.2", "jqueryui": "jquery-ui-1.8.24", "jqdatatable": "jquery.dataTables",
require.config({
baseUrl: "/Scripts/",
paths: {
"jquery": "jquery-1.8.2",
"jqueryui": "jquery-ui-1.8.24",
"jqdatatable": "jquery.dataTables",
"bootstrapdatatable": "dataTables.bootstrap",
"KO": "knockout-2.2.0"
},
shim: {
"jqdatatable": "jquery.dataTables",
"bootstrapdatatable": "dataTables.bootstrap"
}
});
define(["jquery", "jqdatatable", "bootstrapdatatable","KO"], function ($,ko) {
$(document).ready(function () {
var urlPath = window.location.pathname;
ko.applyBindings(CompanyListVM);
CompanyListVM.getComapanies();
var CompanyListVM = {
Company: ko.observableArray([]),
getComapanies: function () {
$.ajax({
type: "GET",
url: '/Company/FetchCompanies',
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (data) {
self.Company(data);
ShowGrid();
},
error: function (err) {
alert(err.status + " : " + err.statusText);
}
});
},
};
}
);
}
);
function ShowGrid() {
(function ($) {
$("#liCompanyList").addClass("active");
$("#liHome").removeClass("active");
$("#liUserManagement").removeClass("active");
$("#liReport").removeClass("active");
$('#example').dataTable();
}(jQuery));
}
//Model
function Company(data) {
this.CompName = ko.observable(data.CompName);
this.CompLanguage = ko.observable(data.CompLanguage);
this.CompEmail1 = ko.observable(data.CompEmail1);
this.CreatedBy = ko.observable(dat.CreatedBy);
}
My CompanyGrid.js如下所示:
require.config({
baseUrl: "/Scripts/",
paths: {
"jquery": "jquery-1.8.2",
"jqueryui": "jquery-ui-1.8.24",
"jqdatatable": "jquery.dataTables",
"bootstrapdatatable": "dataTables.bootstrap",
"KO": "knockout-2.2.0"
},
shim: {
"jqdatatable": "jquery.dataTables",
"bootstrapdatatable": "dataTables.bootstrap"
}
});
define(["jquery", "jqdatatable", "bootstrapdatatable","KO"], function ($,ko) {
$(document).ready(function () {
var urlPath = window.location.pathname;
ko.applyBindings(CompanyListVM);
CompanyListVM.getComapanies();
var CompanyListVM = {
Company: ko.observableArray([]),
getComapanies: function () {
$.ajax({
type: "GET",
url: '/Company/FetchCompanies',
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (data) {
self.Company(data);
ShowGrid();
},
error: function (err) {
alert(err.status + " : " + err.statusText);
}
});
},
};
}
);
}
);
function ShowGrid() {
(function ($) {
$("#liCompanyList").addClass("active");
$("#liHome").removeClass("active");
$("#liUserManagement").removeClass("active");
$("#liReport").removeClass("active");
$('#example').dataTable();
}(jQuery));
}
//Model
function Company(data) {
this.CompName = ko.observable(data.CompName);
this.CompLanguage = ko.observable(data.CompLanguage);
this.CompEmail1 = ko.observable(data.CompEmail1);
this.CreatedBy = ko.observable(dat.CreatedBy);
}
这是显示公司列表。但我想显示另一个显示用户列表的网格。我已经使用必要的更改编写了相同的函数。代码是为Usergrid.js提供的
define(["jquery", "jqdatatable", "bootstrapdatatable", "KO"], function ($, ko) {
$(document).ready(function () {
ko.applyBindings(person);
ko.applyBindings(UserListVM);
UserListVM.getUsers();
var urlPath = window.location.pathname;
var UserListVM = {
User: ko.observableArray([]),
getUsers: function () {
var self = this;
$.ajax({
type: "GET",
url: '/UserManagement/FetchUsers',
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (data) {
self.User(data);
ShowGrid();
},
error: function (err) {
alert(err.status + " : " + err.statusText);
}
});
},
};
}
);
}
);
function ShowUserGrid() {
(function ($) {
$("#liCompanyList").addClass("active");
$("#liHome").removeClass("active");
$("#liUserManagement").removeClass("active");
$("#liReport").removeClass("active");
$('#tblUserList').dataTable();
}(jQuery));
}
//Model
function User(data) {
this.Usr_Id = ko.observable(data.Usr_Id);
this.Usr_Name = ko.observable(data.Usr_Name);
this.Usr_Email = ko.observable(data.Usr_Email);
}
但这一次用户网格不会出现。显示以下错误类型的webconsole错误:ko未定义
请帮助我,我对knockout.js非常陌生。您使用的是require.js,您的参数不匹配
define(["jquery", "jqdatatable", "bootstrapdatatable", "KO"], function ($, ko) {
jquery正在加载到$
jqdatatable正在加载到ko中,谢谢。但我怀疑它在companygrid中是否能完美运行。它只在usergrid中显示错误。请帮我澄清我的疑问