dspangen

<form>
  <input class="name" type="text"/>
  <input class="email" type="text"/>
</form>

dspangen

var View = Marionette.ItemView.extend({
  events: {
    "input input.name": "onNameChange",
    "input input.email": "onEmailChange"
  },
 
  onNameChange: function(e) {
    this.model.set('name', $(e.currentTarget).val());
  },
  

dspangen

var View = Marionette.ItemView.extend({
  // A function that takes a hash of the serialized
  // Model and returns the HTML for display
  template: templateFunc,
  
  ui: {
    // A hash of id to jquery selectors
    nameInput: "input.name"
  }
  

dspangen

<input type="text" data-bind="value: value, toggle: editorOpen"/>
<i class="icon icon-pencil" data-bind="toggle: editVisible">
<i class="icon icon-trash" data-bind="toggle: deleteVisible">

dspangen

var ViewModel = Backbone.Epoxy.Model.extend({
  defaults: {
    editorOpen: false,
    editable: true,
    required: false
  },
  computeds: {
    deleteVisible: function() {
      return !this.getBinding("editorOpen") &&
        this.getBinding("editable") && 

dspangen

Epoxy.Model.extend({
  computeds: { 
    isRunning: function() {
      return this.getBinding("status") === "running";
    },
    isCompleted: function() {
      return this.getBinding("status") === "completed";
    }
  }
})

dspangen

<div class="link">
  <a href="<%- linkUrl %>" title="<%- linkText %>"><%- linkText %></a>
</div>

dspangen

var View = Marionette.ItemView.extend({
  ui: {
    link: ".link a"
  },

  onRender: function() {
    // We need to update the view when the text changes
    this.listenTo(this.model, "change:linkText", function() {
      this.ui.link.text(this.model.get("linkText"));
      this.ui.link.attr('title', this.model.get("linkText"));

dspangen

<a data-bind="text:linkText,attr:{href:linkUrl,title:linkText}"/>
<span class="changed-label" data-bind="toggle:any(isNew, edited)">Changed</span>

dspangen

var BindingView = Backbone.Epoxy.View.extend({
  bindings: {
    "a": "text:linkText,attr:{href:linkUrl,title:linkText}"
  }
});

var model = new Backbone.Model({
  linkText:"use Epoxy for data binding in Backbone", 
  linkUrl:"http://epoxyjs.org/"
});