我正在使用Web API 2.2和Knockout JS,我的网页出现以下错误:
Uncaught ReferenceError: Unable to process binding
"submit: function (){return ChangePassword }"
Message: ChangePassword is not defined
我已经检查了其他回复,this response并确认我的外壳是正确的。
我的Knockout JS函数文件名为app.js,这里是ChangePassword函数:
self.ChangePassword = function () {
self.result = ('');
var data = {
//grant_type: 'password',
OldPassword : self.oldPassword(),
NewPassword: self.newPassword()
};
$.ajax({
type: 'POST',
url: '/api/Account/ChangePassword',
contentType: 'application/json; charset=utf-8',
data: JSON.stringify(data)
}).done(function (data) {
self.result('Done!');
}).fail(showError);
}
在AppViewModel函数的底部绑定为:
ko.applyBindings(new AppViewModel());
html称之为:
<div class="col-sm-4">
<form data-bind="submit: ChangePassword">
<h3>Password change</h3>
<div class="form-group">
<label>Password</label>
<input class="form-control" type="password" data-bind="value: oldPassword" />
</div>
<div class="form-group">
<label>New Password</label>
<input class="form-control" type="password" data-bind="value: newPassword" />
</div>
<div class="form-group">
<button type="submit" class="btn btn-default">Change Password</button>
</div>
</form>
我真的很茫然,感谢您提前提供的任何帮助。
编辑:这是完整的app.js类:
function AppViewModel() {
var self = this;
var tokenKey = 'accessToken';
//----------------------------------------
self.result = ko.observable();
self.user = ko.observable();
self.registerEmail = ko.observable();
self.registerPassword = ko.observable();
self.registerPassword2 = ko.observable();
self.loginEmail = ko.observable();
self.loginPassword = ko.observable();
self.oldPassword = ko.observable();
self.newPassword = ko.observable();
self.newEmail = ko.observable();
//----------------------------------------
// Show Error
function showError(jqXHR) {
self.result(jqXHR.status + ': ' + jqXHR.statusText);
}
// Test API
self.callApi = function () {
self.result('');
var token = sessionStorage.getItem(tokenKey);
var headers = {};
if (token) {
headers.Authorization = 'Bearer ' + token;
}
$.ajax({
type: 'GET',
url: '/api/values',
headers: headers
}).done(function (data) {
self.result(data);
}).fail(showError);
}
// ------------------- Account Methods ------------------- \\
// User info
// External
/*self.userInfo = function () {
self.result = ('');
var data = {
Email: self.registerEmail
};
$.ajax({
type: 'GET',
url: '/api/Account/UserInfo',
contentType: 'application/json; charset=utf-8'
}).done(function(){
self.result(data);
}).fail(showError);
}*/
// Change Password
self.ChangePassword = function () {
self.result = ('');
var data = {
//grant_type: 'password',
OldPassword : self.oldPassword(),
NewPassword: self.newPassword()
};
$.ajax({
type: 'POST',
url: '/api/Account/ChangePassword',
contentType: 'application/json; charset=utf-8',
data: JSON.stringify(data)
}).done(function (data) {
self.result('Done!');
}).fail(showError);
}
// Register
self.register = function () {
self.result('');
var data = {
Email: self.registerEmail(),
Password: self.registerPassword(),
ConfirmPassword: self.registerPassword2()
};
$.ajax({
type: 'POST',
url: '/api/Account/Register',
contentType: 'application/json; charset=utf-8',
data: JSON.stringify(data)
}).done(function (data) {
self.result("Done!");
}).fail(showError);
}
// Login
self.login = function () {
self.result('');
var loginData = {
grant_type: 'password',
userName: self.loginEmail(),
password: self.loginPassword()
};
$.ajax({
type: 'POST',
url: '/Token',
data: loginData
}).done(function (data) {
self.user(data.userName);
// Cache the access token in session storage.
sessionStorage.setItem(tokenKey, data.access_token);
}).fail(showError);
}
// Logout
self.logout = function () {
self.user('');
sessionStorage.removeItem(tokenKey)
}
// Testing
self.Test = function () {
self.result('');
var token = sessionStorage.getItem(tokenKey);
var headers = {};
if (token) {
headers.Authorization = 'Bearer ' + token;
}
$.ajax({
type: 'GET',
url: '/api/scheduler/Test',
contentType: 'application/json; charset=utf-8',
headers: headers,
data: {}
}).done(function (data) {
self.result('Done!');
}).fail(showError);
}
}
// Apply the bindings
ko.applyBindings(new AppViewModel());