Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
KoLite contains a set of helpers to aid in creating MVVM applications using JavaScript and Knockout.
branch: master

This branch is 34 commits behind CodeSeven:master

Fetching latest commit…

Cannot retrieve the latest commit at this time

Failed to load latest commit information.
README.md
knockout.activity.js
knockout.asyncCommand.js
knockout.dirtyFlag.js

README.md

KoLite

KoLite contains a set of helpers to aid in creating MVVM applications using JavaScript and Knockout. Including:

  1. asyncCommand
  2. activity
  3. dirtyFlag

Current Version

1.0.4

NuGet

Also available on NuGet at https://nuget.org/packages/KoLite

Quick start

asyncCommand

demo: http://jsfiddle.net/johnpapa/gDZDS/

<button data-bind="command: saveCommand">Save</button>
self.saveCommand = ko.asyncCommand({
    execute: function(callback) {
        $.ajax({
            complete: callback,
            data: { name: self.name() },
            type: 'POST',
            url: '/save/',
                    
            success: function(result) {
                alert('Name saved:' + result)
            }
        })
    },
        
    canExecute: function(isExecuting) {
        return !isExecuting && self.name()
    }
})

asyncCommand - Knockout's 'click' binding handler (the default)

<buttondata-bind="command: onClickCommand">click handler test</button>

asyncCommand - Knockout's 'change' binding handler (or any Knockout binding handler)

<select data-bind="command: { change: onChangeCommand }">
    <option>change handler test - a</option>
    <option>change handler test - b</option>
</select>

asyncCommand - Knockout's 'event' binding handler (documentation here)

<div data-bind="command: { mouseover: tooltipCommand }">Information</div>

asyncCommand and activity

<button data-bind="activity: saveCommand.isExecuting, command: saveCommand">Save</button>

dirtyFlag

// Your model
var Person = function () {
    var self = this;

    self.id = ko.observable();
    self.firstName = ko.observable().extend({ required: true });
    self.lastName = ko.observable().extend({ required: true });
    self.dirtyFlag = new ko.DirtyFlag([self.firstName, self.lastName]);

    return self;
};

Hook these into your viewmodel ...

// Property on your view model. myPerson is an instance of Person.
// Did it Change?
isDirty = ko.computed(function () {
    return myPerson().dirtyFlag().isDirty()
})
// Resync Changes
dirtyFlag().reset()

Depends on

>= jQuery 1.4.4

>= KnockoutJS 2.0.0

Authors

Hans Fjällemark

John Papa

Credits

Inspired by http://KnockoutJS.com

Copyright

Copyright © 2012 Hans Fjällemark & John Papa.

License

KoLite is under MIT license - http://www.opensource.org/licenses/mit-license.php

Something went wrong with that request. Please try again.