How to load knockout.validation with knockout in requirejs

Question

I am going to define my model in require js and i need knockout and knockout validation plugin in my module and also jquery .

define(["knockout","jquery","knockout.validation"], function (ko,$,validation) {
  // knockout model here with some knockout validation 

    return function SignUpViewModel() {
    var self = this;
    self.name = ko.observable();
    self.email = ko.observable().extend({ required: true });
    self.password = ko.observable().extend({
       required: true,
       minLength: 6
   });
   self.confirmPassword = ko.observable().extend({ mustEqual: self.password() });
   self.company = ko.observable();
   self.availableCountries = ko.observableArray(['Pakistan', 'USA', 'Egypt', 'UAE']);
   self.selectedCountry = ko.observable();
   self.errors = ko.validation.group(self);
   }           
 });

But when i run this i got the following error .

Uncaught ReferenceError: ko is not defined

i also try to debug and found that all other librariesknockout, jquery are loading perfectly .

and here is my config portion

require.config({
  baseUrl: "/Scripts",
  paths: {
    "Signup" : "Signup",
    "knockout": "knockout-2.3.0",
    "knockout.validation": "knockout.validation",
    "jquery": "require-jquery"
    }
});

Chevrotain

Which version of the knockout.validation are you using? And from where do you get the exception: Uncaught ReferenceError: ko is not defined? – Bateau

I am using version 2.0 and i see this error in browser , when i debug my model . – Chevrotain

I think you also need a shim for validation as it is dependent on Konckout right – Tortfeasor

There is no 2.0 version of the validation plugin... Where do you downloaded the script: github? nuget? cdnjs? somewhere else? Because the validation plugin supports requirejs since 2012.08 so in theory there is no need for a shim to use it. – Bateau

i downloaded it from nuget and sorry the version name was 1.0.1 . – Chevrotain

Answer 1

Your model works fine with me, here's my require config:

requirejs.config({
  baseUrl: '/Scripts',
  paths: {
    'jquery': 'jquery-1.9.1.min',
    'knockout' : 'knockout-2.3.0',
  }
});
// myModel.js is the file containing your model code.
require( ["myModel", "knockout"], function(model, ko){
  ko.applyBindings(new model());
});

myModel.js

define(["knockout","jquery","knockout.validation"], function (ko,$,validation) {
// knockout model here with some knockout validation 

  return function SignUpViewModel() {
    var self = this;
    self.name = ko.observable();
    self.email = ko.observable().extend({ required: true });
    self.password = ko.observable().extend({
       required: true,
       minLength: 6
    });
    self.confirmPassword = ko.observable().extend({ mustEqual: self.password() });
    self.company = ko.observable();
    self.availableCountries = ko.observableArray(['Pakistan', 'USA', 'Egypt', 'UAE']);
    self.selectedCountry = ko.observable();
    self.errors = ko.validation.group(self);
  };           
});

and you don't need require-jquery anymore, since jQuery defines named AMD module 'jquery' (all lower case) when it detects AMD/RequireJS.

Girovard

I still get the Uncaught ReferenceError: ko is not defined knockout.validation.js:2 for 1.0.1 from nuget. – Zelazny

Answer 2

require.config({
    baseUrl: "/Scripts",
    paths: {
        "Signup": "Signup",
        "knockout": "knockout-2.3.0",
        "knockout.validation": "knockout.validation",
        "jquery": "require-jquery"
    },
    shim: {
        "knockout.validation": {
            "deps": ["knockout"]
        }
    }
});

http://www.requirejs.org/docs/api.html#config-shim

Hyperform