https://github.com/passy/backbone.datalink

Wrapper around Synapse for easy data binding between models and views.
https://github.com/passy/backbone.datalink

Last synced: about 1 year ago
JSON representation

Wrapper around Synapse for easy data binding between models and views.

• Host: GitHub
• URL: https://github.com/passy/backbone.datalink
• Owner: passy
• License: gpl-3.0
• Created: 2012-03-30T23:42:58.000Z (over 14 years ago)
• Default Branch: master
• Last Pushed: 2020-03-27T05:41:36.000Z (over 6 years ago)
• Last Synced: 2025-02-25T02:12:41.478Z (over 1 year ago)
• Language: CoffeeScript
• Homepage:
• Size: 36.1 KB
• Stars: 5
• Watchers: 2
• Forks: 1
• Open Issues: 1
• Metadata Files:
  • Readme: README.rst
  • License: MIT-LICENSE

Awesome Lists containing this project

README

          
=================

Backbone.DataLink

=================

.. image:: https://secure.travis-ci.org/passy/backbone.datalink.png?branch=master

    :alt: Travis CI build status

    :target: http://travis-ci.org/#!/passy/backbone.datalink

Simple wrapper around Synapse to keep data between your Backbone models and

views in sync.

Requirements

============

`Synapse `_ must be installed and

configured with both the jQuery and Backbone Model hook.

Installation

============

The library itself can be installed via the `volo `_

package manager::

    volo add passy/backbone.datalink

Alternatively, you can grab the latest version here:

* `Uncompressed `_

* `Uglified `_

Backbone.DataLink supports the `UMD `_ and can be

loaded in CommonJS environments, via AMD and as traditional browser script.

::

    require(['synapse', 'synapse/jquery', 'synapse/backbone-model', 'datalink'],

        function (Synapse, JQueryHook, BackboneModelHook, DataLink) {

            Synapse.hooks = [Synapse, JQueryHook, BackboneModelHook];

        }

    )

Example

=======

To sync the elements title and description of your model with the

corresponding input fields in your rendered view, add this after your

rendering is done::

    datalink.linkView(this, ['title', 'description'])

Your template may look like this::

    

    

To override the default settings, provide a hash as third parameter::

    datalink.linkView(this, ['title', 'description'], {prefill: false})

To override certain settings for specific elements, provide a fourth parameter::

    datalink.linkView(this, ['title', 'description'], {prefill: true}, {

        'title': {attribute: "name"},

        'description': {prefill: false}

    })

Options

=======

* ``bind``, default ``syncWith``

    * Binding function. One of 'syncWith', 'observe' or 'notify'.

* ``attribute``, default ``data-bind``

    * HTML attribute to look for to map model attributes.

* ``ignoreEmpty``, default ``false``

    * If false, raises an exception if an element could not be bound.

* ``prefill``, default ``true``

    * Fill observed elements with model data on load.

* ``triggerOnBind``, default ``false``

    * Fire change event after binding.

Alternatives

============

There are some projects with similar goals:

* `Backbone.ModelBinder `_

* `backbone.modelbinding `_

License

=======

Dual licensed under the MIT or GPL Version 3 licenses.