Step 2 - Use ItemView

1. Use ItemView in views/contactForm.js:

   1. Change Backbone.View.extend to 'Marionette.ItemView.extend'

   2. Instead of

      template: _.template($('#tpl-new-contact').html()),
      

      use just

      template: '#tpl-new-contact',
      

   3. Remove render method

   4. Add serializeData method

      serializeData: function() {
        return _.extend(this.model.toJSON(), {
          isNew: this.model.isNew()
        });
      },
      

   5. Use ui to organize UI elements

      ui: {
      nameInput: '.contact-name-input',
      telInput: '.contact-tel-input',
      emailInput: '.contact-email-input'
      },
      

      this.trigger('form:submitted', {
        name: this.ui.nameInput.val(),
        tel: this.ui.telInput.val(),
        email: this.ui.emailInput.val()
      });
      

2. Use ItemView in views/contact.js:

   1. Change Backbone.View.extend to 'Marionette.ItemView.extend'

   2. Instead of

      template: _.template($('#tpl-contact').html()),
      

      use just

      template: '#tpl-contact',
      

   3. Remove render method

   4. Check in browser

   5. Instead of

      initialize: function() {
        this.listenTo(this.model, 'remove', this.remove);
      },
      

      use modelEvents

      modelEvents: {
        'remove': 'close'
      },
      

Difference