Never Pay your Mortgage

    knockout-dragdrop

    2.6.1 • Public • Published

    knockout-dragdrop

    A drag and drop binding for Knockout.

    Click here to see an example

    Install

    NPM

    npm install knockout-dragdrop

    Bower

    bower install knockout-dragdrop

    Usage

    Dragging between two lists:

    <h2>Drag from here</h2>
    <ul data-bind="foreach: source">
        <li data-bind="text: $data, dragZone: { name: 'lists' }"></li>
    </ul>
     
    <h2>Drop here</h2>
    <ul data-bind="foreach: target, dropZone: { accepts: 'lists', drop: drop }">
        <li data-bind="text: $data"></li>
    </ul>
    var model = {
        source: ko.observableArray([
            'Declan',
            'Tessa',
            'Claire',
            'Violet',
            'Alice',
            'Mia',
            'Camille',
            'Aiden'
        ]),
        target: ko.observableArray(),
        drop: function (data, model) {
            model.source.remove(data);
            model.target.push(data);
        }
    };
    ko.applyBindings(model);

    Running the example locally

    Run the following command:

    npm install && bower install && serve
    

    and open http://localhost:3000 in your browser.

    License

    Knockout.dragdrop is licensed under a standard 3-clause BSD license -- see the LICENSE-file for details.

    Install

    npm i knockout-dragdrop

    DownloadsWeekly Downloads

    1,336

    Version

    2.6.1

    License

    none

    Last publish

    Collaborators

    • hanstdam
    • sunesimonsen
    • papandreou
    • gustavnikolaj