knockout.mapping | Object mapping plugin for KnockoutJS | Map library

You need to check on chrome developers tools what are the computed attributes for this element, you might find out that there is another implementation for this class that hides it.

to see the computed attributes:

1. Open developer tools on google chrome (f12 or inspect element on the desired element)
2. Select the element you want to check on the Elements Tab
3. From the right pane of the developer tools select the Computed Tab

there you will find the list of computed CSS attributes and if you click on any of the attributes it'll open the location of this implementation

hope that will help

I solved it by initializing self =this, and replacing this in the code with self

In order to use the jQuery form validation plugin, you need to set it up on your form first. The documentation gives a few examples of this, but basically you need to select the form and run the .validate() function.

I'm a little uncertain from your description which part isn't working, but there's two issues that I can see.

The first issue is pretty minor and might just be a transcription typo; you're using "datepicker" for the binding definition and "datePicker" in the markup data-bind. Binding names are case sensitive.

The second, primary, issue I think is simply that the date picker doesn't know you've updated the text in its element. Try something like this for your binding's update function:

You can add the enable binding with a function to check the collection of checked items.

It looks like you might not actually be loading the Knockout mapping script into the browser. It's not part of the Knockout core - it's a separate library.

You can grab it from here: https://www.npmjs.com/package/knockout-mapping

You could need to include that in your page/package/bundle. Can you check if it's being included? You reference the types, but that doesn't mean that the resulting page or bundle will automatically have access to the mapping library.

As a quick diagnostic, try referencing it manually in a script tag from a CDN:

In the transition from ViewModel -> plain object -> ViewModel you loose the relation between the products in your cart and the ones in your handlerVM.

A common solution is to, when loading a plain object, manually search for the existing viewmodels and reference those instead. I.e.:

• We create a new cartItemVM from the plain object
• Inside its cartItemName, there's an object that does not exist in handlerVM.
• We look in handlerVM for a product that resembles this object, and replace the object by the one we find.

In code, inside loadCart, before setting the new viewmodels:

When you change the 's value through code, knockout searches for the new value in the list of options so it can update the UI. When you set currentPerson (which is bound to the value) to anything that is not present in the persons array (which is bound to options), the UI will not update. When you're saving a person, you're serializing to JSON. After reconstructing, you receive a new object that knockout cannot match with the previously bound options. There are two possible solutions: Use the optionsValue binding so knockout uses the id property to match persons rather than an instance check, or Do a manual search for a previously created viewmodel when loading a person. I've implemented solution 2 in the example below. var currentPersonAsJson = null; var handlerVM = function () { var self = this; self.persons = ko.observableArray([ new PersonVM("john", 1), new PersonVM("paul", 2), new PersonVM("viki", 3), ]); self.currentPerson = ko.observable(); self.save = function () { currentPersonAsJson = ko.toJSON(self.currentPerson); console.log(currentPersonAsJson); } self.load = function () { var loadedPerson = ko.mapping.fromJSON(currentPersonAsJson); // loadedPerson is a new instance, so it won't match anything // inside self.persons // Let's do a manual lookup: var matchedVM = self.persons().find( p => p.id() === loadedPerson.id ); if (matchedVM) { loadedPerson = matchedVM; } // Edge case: We've loaded something that we don't know: else { self.persons.push(loadedPerson); } self.currentPerson(loadedPerson); } self.log = function () { console.log(ko.toJSON(self.currentPerson)); } } var PersonVM = function (name, id) { var self = this; self.name = ko.observable(name); self.id = ko.observable(id); } var handler = new handlerVM(); ko.applyBindings(handler);

Bonus edit: solution 1:

There are several things:

1. Typescript config, you can copy. With your types
2. change import export and remove namespace

export class App { ... }

import { App } from '/path/to/your/file';

1. class needs a destroyer
2. and finally in webpack.config.js you can set properties