Skip to content Skip to sidebar Skip to footer

Knockout Data-bind Click

I am trying to understand a button on a third party site my company uses. The button signs up a user for a class.

Solution 1:

Knockout provides several objects to access different levels of context and $root is of them. The $root object represents the main view model object in the root context. For instance, if your HTML element is inside another binding context, such as inside a foreach, and you want to use a root view model's method in each iteration:

varViewModel = function() {
    this.actionTypes = ko.observableArray([
        { ActionType: "Type A", Title: "Title A"},
        { ActionType: "Type B", Title: "Title B"},
        { ActionType: "Type C", Title: "Title C"}]);

    this.clickAction = function(action) {
        // your ajax request would go herealert(action);
    }
};

ko.applyBindings(newViewModel());
<scriptsrc="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script><divdata-bind="foreach: actionTypes"><aclass="btn btn-large btn-blue"href="javascript:void(0);"data-bind="click: $root.clickAction.bind($data, ActionType)"><spandata-bind="text: Title">Sign up</span></a><div>

Post a Comment for "Knockout Data-bind Click"