Backbone Forms (Backbone 0.9.1)

Base setup for Backbone Forms

HTML

<script src="http://documentcloud.github.com/underscore/underscore-min.js"></script>
<script src="http://documentcloud.github.com/backbone/backbone-min.js"></script>
<script src="https://raw.github.com/powmedia/backbone-forms/feature/templates/src/jquery-ui-editors.js"></script>
<script src="https://raw.github.com/powmedia/backbone-forms/master/src/backbone-forms.js"></script>
<link rel="stylesheet" href="https://raw.github.com/powmedia/backbone-forms/master/src/backbone-forms.css">
<html>
<body></body>
</html>

JavaScript

var LoginView = Backbone.View.extend({
            events: {
                  "click button#loginButton": "login",
              },
            render: function() {
                this.form = new Backbone.Form({
                    data: { id: 123, name: '', password: '' }, //Data to populate the form with
                    schema: {
                        name:       { help:'TESTHELP', title:'username', validators: ['required'] },
                        password:   { type: 'Password', validators: ['required'] }
                    }
                    });

                var $button = $('<button type="button" name="login" id="loginButton">login</button>');

                this.$el.append(this.form.render().el);
                this.$el.append($button);
                return this;
                },

            fieldAttrs: {
                style: 'background: red',
                title: 'Tooltip help'
            },

            login: function() {
                  this.form.commit();
              }
        });

        window.loginView = new LoginView();
        $('#container').html(loginView.render().el);