diff --git a/scripts/build b/scripts/build index 8c17f9a2..efbd78fc 100755 --- a/scripts/build +++ b/scripts/build @@ -18,6 +18,7 @@ var fileList = [ 'fieldset.js', 'field.js', 'nestedField.js', + 'nestedForm.js', 'editor.js', 'editors/text.js', 'editors/textarea.js', diff --git a/src/editors/nestedmodel.js b/src/editors/nestedmodel.js index ebaac4e1..efea4213 100644 --- a/src/editors/nestedmodel.js +++ b/src/editors/nestedmodel.js @@ -12,11 +12,9 @@ Form.editors.NestedModel = Form.editors.Object.extend({ if (!this.form) throw new Error('Missing required option "form"'); if (!options.schema.model) throw new Error('Missing required "schema.model" option for NestedModel editor'); - }, - render: function() { //Get the constructor for creating the nested form; i.e. the same constructor as used by the parent form - var NestedForm = this.form.constructor; + var NestedForm = this.form.NestedForm; var data = this.value || {}, key = this.key, @@ -30,15 +28,6 @@ Form.editors.NestedModel = Form.editors.Object.extend({ idPrefix: this.id + '_', fieldTemplate: 'nestedField' }); - - this._observeFormEvents(); - - //Render form - this.$el.html(this.nestedForm.render().el); - - if (this.hasFocus) this.trigger('blur', this); - - return this; }, /** diff --git a/src/editors/object.js b/src/editors/object.js index 4266f487..2dc0b852 100644 --- a/src/editors/object.js +++ b/src/editors/object.js @@ -22,11 +22,9 @@ Form.editors.Object = Form.editors.Base.extend({ //Check required options if (!this.form) throw new Error('Missing required option "form"'); if (!this.schema.subSchema) throw new Error("Missing required 'schema.subSchema' option for Object editor"); - }, - render: function() { //Get the constructor for creating the nested form; i.e. the same constructor as used by the parent form - var NestedForm = this.form.constructor; + var NestedForm = this.form.NestedForm; //Create the nested form this.nestedForm = new NestedForm({ @@ -35,6 +33,9 @@ Form.editors.Object = Form.editors.Base.extend({ idPrefix: this.id + '_', Field: NestedForm.NestedField }); + }, + + render: function() { this._observeFormEvents(); @@ -54,7 +55,7 @@ Form.editors.Object = Form.editors.Base.extend({ setValue: function(value) { this.value = value; - this.render(); + this.nestedForm.setValue(this.value); }, focus: function() { diff --git a/src/form.js b/src/form.js index 46a36d17..70cab153 100644 --- a/src/form.js +++ b/src/form.js @@ -57,6 +57,7 @@ var Form = Backbone.View.extend({ this.Fieldset = options.Fieldset || this.Fieldset || constructor.Fieldset; this.Field = options.Field || this.Field || constructor.Field; this.NestedField = options.NestedField || this.NestedField || constructor.NestedField; + this.NestedForm = options.NestedForm || this.NestedForm || constructor.NestedForm; //Check which fields will be included (defaults to all) var selectedFields = this.selectedFields = options.fields || _.keys(schema); diff --git a/src/nestedForm.js b/src/nestedForm.js new file mode 100644 index 00000000..6c8a8854 --- /dev/null +++ b/src/nestedForm.js @@ -0,0 +1,12 @@ + +//================================================================================================== +//NESTEDFIELD +//================================================================================================== + +Form.NestedForm = Form.extend({ + + template: _.template('\ + \ + ', null, Form.templateSettings) + +}); diff --git a/src/templates/bootstrap3.js b/src/templates/bootstrap3.js index d0305fc3..9bb3351e 100644 --- a/src/templates/bootstrap3.js +++ b/src/templates/bootstrap3.js @@ -44,6 +44,9 @@ '); Form.editors.Base.prototype.className = 'form-control'; + Form.editors.Object.prototype.className = ''; + Form.editors.NestedModel.prototype.className = ''; + Form.Field.errorClassName = 'has-error'; diff --git a/test/index.html b/test/index.html index 2d81b448..7ee0fc54 100644 --- a/test/index.html +++ b/test/index.html @@ -25,6 +25,7 @@ +