https://github.com/hiddentao/backbone-elements

Backbone.View shortcut for obtaining child element references
https://github.com/hiddentao/backbone-elements

Last synced: 8 days ago
JSON representation

Backbone.View shortcut for obtaining child element references

• Host: GitHub
• URL: https://github.com/hiddentao/backbone-elements
• Owner: hiddentao
• License: mit
• Created: 2015-03-24T01:45:18.000Z (over 9 years ago)
• Default Branch: master
• Last Pushed: 2015-03-24T04:01:04.000Z (over 9 years ago)
• Last Synced: 2024-10-13T20:31:48.745Z (26 days ago)
• Language: JavaScript
• Size: 129 KB
• Stars: 0
• Watchers: 3
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • Contributing: CONTRIBUTING.md
  • License: LICENSE.md

Awesome Lists containing this project

README

        
# backbone-elements

[![Build Status](https://secure.travis-ci.org/hiddentao/backbone-elements.png)](http://travis-ci.org/hiddentao/backbone-elements)

__Tested with Backbone 1.1.2__

This library allows you to easily define and use child elements within your Backbone views:

```coffee

class View extends Backbone.View

  elements:

    ".status": "status"

    ".child-element > div": "childDiv"

  events:

    "click a.another-div": "_clickHandler"

  initialize: ->

    super // parent initialize() calls @refreshElements()

    console.log 'started'

  # use the references in functions

  _clickHandler: ->

    @$status.text "clicked"

    @$childDiv.remove()

    @refreshElements() # refresh element references

```

You can change the default element prefix too:

```coffee

class View extends Backbone.View

  elementPrefix: ''

  elements:

    ".status": "status"

    ".child-element > div": "childDiv"

  events:

    "click a.another-div": "_clickHandler"

  initialize: ->

    super // parent initialize() calls @refreshElements()

    console.log 'started'

  # use the references in functions

  _clickHandler: ->

    @status.text "clicked"

    @childDiv.remove()

    @refreshElements() # refresh element references

```

### node.js

Install using [npm](http://npmjs.org/):

    $ npm install backbone-elements

### Browser

Use [bower](https://github.com/bower/bower):

    $ bower install backbone-elements

## Building

To build the code and run the tests:

    $ npm install -g gulp

    $ npm install

    $ gulp

## Contributing

Contributions are welcome! Please see [CONTRIBUTING.md](https://github.com/hiddentao/backbone-elements/blob/master/CONTRIBUTING.md).

## License

MIT - see [LICENSE.md](https://github.com/hiddentao/backbone-elements/blob/master/LICENSE.md)