Question

I have a question about knockout combined with jQuery. If I only use Knockout, the program works fine, but as soon as I bind in jQuery it doesn’t work anymore. The second page isn’t shown.

This is how I bind all the needed things:

<script type="text/javascript" src="../../Scripts/upshot.min.js"></script>
<script type="text/javascript" src="../../Scripts/Upshot_Timeworx.js"></script>
<script type="text/javascript" src="../../Scripts/knockout-2.2.0.js"></script>
<script src="../../Scripts/jquery.mobile-1.2.0.js" type="text/javascript"></script>


var masterViewModel = {

        loginVM: ko.observable(),
        startVM: ko.observable(),
        projectStartVM: ko.observable()

    };

    var LoginVM = function () {
        //Some Code
    };

    var StartVM = function () {
         //Some Code
    };

    var ProjectStartVM = function () {
    //Some Code
    //That's how I open the next "Page"
    masterViewModel.loginVM(new LoginVM());
    ko.applyBindings(masterViewModel);

LoginVM:

var LoginVM = function () {
            var self = this;
            self.mandant = ko.observable();
            self.user = ko.observable();
            self.password = ko.observable();
            self.showDetails = function () {

                if ((self.user() == "Gregor") && (self.password() == "gregrech")) {
                    masterViewModel.loginVM(null);
                    masterViewModel.startVM(new StartVM());
                }
                else {
                    alert("Username oder Passwort falsch");
                }

            };
        };

Anyone knows what my problem is?

Answer 1

This appears to work, not sure what you were actually asking for. It binds a username/password box with a click to proceed that functions.

User:<input type="text" data-bind="value: user"/>
Password:<input type="password" data-bind="value: password"/>
<input type="button" data-bind="click: showDetails" value="Show"/>

http://jsfiddle.net/Maslow/mmMcs/

var LoginVM = function () {
  var self = this;
  self.mandant = ko.observable();
  self.user = ko.observable();
  self.password = ko.observable();

  self.showDetails = function () {

    if ((self.user() == "Gregor") && (self.password() == "gregrech")) {
      masterViewModel.loginVM(null);
      masterViewModel.startVM(new StartVM());
    } else {
      alert("Username oder Passwort falsch");
    }

  };
};
var masterViewModel = {

  loginVM: ko.observable(),
  startVM: ko.observable(),
  projectStartVM: ko.observable()

};


var StartVM = function () {
  alert('success');
};

ko.applyBindings(new LoginVM());