KnockoutJS未被捕获的参考错误

时间:2016-08-15 17:17:39

标签: javascript asp.net-web-api knockout.js

我正在使用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());

0 个答案:

没有答案