Moved to new form object.

app/assets/javascripts/app/controllers/_application_controller.js.coffee

@@ -26,338 +26,18 @@ class App.Controller extends Spine.Controller
       return true if role.name is name
     return false
 
-#  # extend delegateEvents to unbind and undelegate
-#  delegateEvents: ->
-#    
-#    # here unbind and undelegate while @el
-#    @el.unbind()
-#    @el.undelegate()
-#    
-#    for key, method of @events
-#      unless typeof(method) is 'function'
-#        method = @proxy(@[method])
-#
-#      match      = key.match(@eventSplitter)
-#      eventName  = match[1]
-#      selector   = match[2]
-#
-#      if selector is ''
-#        @el.bind(eventName, method)
-#      else
-#        @el.delegate(selector, eventName, method)
-
-  formGen: (data) ->
-    form = $('<form>')
-    fieldset = $('<fieldset>')
-    fieldset.appendTo(form)
-    autofocus = 1;
-    if data.autofocus isnt undefined
-      autofocus = data.autofocus
-
-    attributes = clone( data.model.configure_attributes || [] )
-    for attribute in attributes
-
-      if !attribute.readonly && ( !data.required || data.required && attribute[data.required] )
-
-        # set autofocus
-        if autofocus is 1
-          attribute.autofocus = 'autofocus'
-          autofocus = 0
-          
-        # set required option
-        if !attribute.null
-          attribute.required = 'required'
-        else
-          attribute.required = ''
-
-        # set multible option
-        if attribute.multiple
-          attribute.multiple = 'multiple'
-        else
-          attribute.multiple = ''
-
-        # set autocapitalize option
-        if attribute.autocapitalize is undefined || attribute.autocapitalize
-          attribute.autocapitalize = ''
-        else
-          attribute.autocapitalize = 'autocapitalize="off"'
-
-        # set autocomplete option
-        if attribute.autocomplete is undefined
-          attribute.autocomplete = ''
-        else
-          attribute.autocomplete = 'autocomplete="' + attribute.autocomplete + '"'
-
-        # set value
-        if data.params
-          if attribute.name of data.params
-            attribute.value = data.params[attribute.name]
-
-        # set default value
-        else
-          if 'default' of attribute
-#            @log 'default', attribute.default
-            attribute.value = attribute.default
-          else
-            attribute.value = ''
-        
-        # add item
-        item = $( @formGenItem(attribute, data.model.className) )
-        item.appendTo(fieldset)
-
-        # if password, add confirm password item
-        if attribute.type is 'password'
-
-          attribute.display = attribute.display + ' (confirm)'
-          attribute.name = attribute.name + '_confirm';
-
-          item = $( @formGenItem(attribute, data.model.className) )
-          item.appendTo(fieldset)
-
-    # return form
-    return form.html()
-
-  formGenItem: (attribute, classname) ->
-
-    # create item id
-    attribute.id = classname + '_' + attribute.name        
-
-    # build options list based on config
-    selection = []
-    if attribute.options
-      if attribute.nulloption
-        attribute.options[''] = '-'
-      for key of attribute.options
-        selection.push {
-          name:  attribute.options[key],
-          value: key,
-        }
-
-    # build options list based on relation
-    attribute.options = selection || []
-    if attribute.relation && App[attribute.relation]
-      attribute.options = []
-      if attribute.nulloption
-        attribute.options[''] = '-'
-        attribute.options.push {
-          name:  '-',
-          value: '',
-        }
-
-      list = []
-      if attribute.filter && attribute.filter[attribute.name]
-        filter = attribute.filter[attribute.name]
-
-        # check all records
-        for record in App[attribute.relation].all()
-
-          # check all filter attributes
-          for key of filter
-
-            # check all filter values as array
-            for value in filter[key]
-
-              # if it's matching, use it for selection
-              if record[key] is value
-                list.push record
-      else
-        list = App[attribute.relation].all()
-
-      # build options list
-      list.forEach( (item) =>
-
-        # if active or if active doesn't exist
-        if item.active || !( 'active' of item )
-          name = '???'
-          if item.name
-            name = item.name
-          else if item.firstname
-            name = item.firstname
-            if item.lastname
-              if name
-               name = name + ' '
-            name = name + item.lastname
-
-          name_new = name
-          if attribute.translate
-            name_new = Ti(name)
-          attribute.options.push {
-            name:  name_new,
-            value: item.id,
-            note:  item.note,
-          }
-      )
-
-      # sort attribute.options
-      options_tmp = []
-      for i in attribute.options
-        options_tmp.push i['name'].toLowerCase()
-      options_tmp = options_tmp.sort()
-
-      options_new = []
-      options_new_used = {}
-      for i in options_tmp
-        for ii, vv in attribute.options
-          if !options_new_used[ ii['value'] ] && i.toString().toLowerCase() is ii['name'].toString().toLowerCase()
-            options_new_used[ ii['value'] ] = 1
-            options_new.push ii
-      attribute.options = options_new
-
-    # finde selected/checked item of list
-    if attribute.options
-      for record in attribute.options
-        if typeof attribute.value is 'string' || typeof attribute.value is 'number' || typeof attribute.value is 'boolean'
-
-          # if name or value is matching
-          if record.value.toString() is attribute.value.toString() || record.name.toString() is attribute.value.toString()
-            record.selected = 'selected'
-            record.checked = 'checked'
-#          if record.name.toString() is attribute.value.toString()
-#            record.selected = 'selected'
-#            record.checked = 'checked'
-        if ( attribute.value && record.value && _.include(attribute.value, record.value) ) || ( attribute.value && record.name && _.include(attribute.value, record.name) )
-          record.selected = 'selected'
-          record.checked = 'checked'
-
-    # boolean
-    if attribute.tag is 'boolean'
-      
-      # build options list
-      if _.isEmpty(attribute.options)
-        attribute.options = [
-          { name: 'active', value: true } 
-          { name: 'inactive', value: false } 
-        ]
-
-      # update boolean types
-      for record in attribute.options
-        record.value = '{boolean}::' + record.value
-
-      # finde selected item of list
-      for record in attribute.options
-        if record.value is '{boolean}::' + attribute.value
-          record.selected = 'selected'
-
-      # return item
-      item = App.view('generic/select')( attribute: attribute )
-
-    # select
-    else if attribute.tag is 'select'
-      item = App.view('generic/select')( attribute: attribute )
-
-    # checkbox
-    else if attribute.tag is 'checkbox'
-      item = App.view('generic/checkbox')( attribute: attribute )
-
-    # radio
-    else if attribute.tag is 'radio'
-      item = App.view('generic/radio')( attribute: attribute )
-
-    # textarea
-    else if attribute.tag is 'textarea'
-      item = App.view('generic/textarea')( attribute: attribute )
-
-    # autocompletion
-    else if attribute.tag is 'autocompletion'
-      item = App.view('generic/autocompletion')( attribute: attribute )
-
-      a = ->
-#        if attribute.relation && App[attribute.relation]
-#          @log '1312312333333333333', App[attribute.relation]
-#        @log '1231231231', '#' + attribute.id + '_autocompletion'
-        @local_attribute = '#' + attribute.id
-        @local_attribute_full = '#' + attribute.id + '_autocompletion'
-        @callback = attribute.callback
-
-        b = (event, key) =>
-#          @log 'zzzz', event, item, key, @local_attribute
-          $(@local_attribute).val(key)
-          if @callback
-            @callback( user_id: key )
-        ###
-        $(@local_attribute_full).tagsInput(
-          autocomplete_url: '/user_search',
-          height: '30px',
-          width: '530px',
-          auto: {
-            source: '/user_search',
-            minLength: 2,
-            select: ( event, ui ) =>
-              @log 'selected', event, ui
-              b(event, ui.item.id)
-          }
-        )
-        ###        
-        $(@local_attribute_full).autocomplete(
-          source: '/user_search',
-          minLength: 2,
-          select: ( event, ui ) =>
-            @log 'selected', event, ui
-            b(event, ui.item.id)
-        )
-
-      @delay(a, 800)
-
-    # input
-    else
-      item = App.view('generic/input')( attribute: attribute )
-
-    if !attribute.display
-      return item
-    else
-      return App.view('generic/attribute')(
-        attribute: attribute,
-        item:      item,
-      )
-
   # get all params of the form
-  formParam: (form, errors) ->
+  formParam: (form) ->
-    param = {}
+    App.ControllerForm.params(form)
-
-    # find form based on sub elements
-    if $(form).children()[0]
-      form = $(form).children().parents('form')
-
-    # find form based on parents next <form>
-    else if $(form).parents('form')[0]
-      form = $(form).parents('form')
-
-    # find form based on parents next <form>, not really good!
-    else if $(form).parents().find('form')[0]
-      form = $(form).parents().find('form')
-    else
-      @log 'ERROR, no form found!', form
-
-    for key in form.serializeArray()
-      if param[key.name]
-        if typeof param[key.name] is 'string'
-          param[key.name] = [ param[key.name], key.value]
-        else
-          param[key.name].push key.value
-      else
-
-        # check boolean
-        boolean = key.value.split '::'
-        if boolean[0] is '{boolean}'
-          if boolean[1] is 'true'
-            key.value = true
-          else
-            key.value = false
-
-        param[key.name] = key.value
-
-    @log 'formParam', form, param
-    return param
 
   formDisable: (form) ->
-    @log 'disable...', $(form.target).parent()
+    App.ControllerForm.disable(form)
-    $(form.target).parent().find('[type="submit"]').attr('disabled', true)
-    $(form.target).parent().find('[type="reset"]').attr('disabled', true)
 
   formEnable: (form) ->
-    @log 'enable...', $(form).parent()
+    App.ControllerForm.enable(form)
-    $(form).parent().find('[type="submit"]').attr('disabled', false)
+
-    $(form).parent().find('[type="reset"]').attr('disabled', false)
+  formValidate: (data) ->
+    App.ControllerForm.validate(data)
 
   table: (data) ->
     overview = data.overview || data.model.configure_overview || []
@@ -396,7 +76,7 @@ class App.Controller extends Spine.Controller
       data_types = data.overview_extended
 
     # generate content data
-    objects = clone( data.objects )
+    objects = _.clone( data.objects )
     for object in objects
       for row in data_types
         
@@ -487,24 +167,6 @@ class App.Controller extends Spine.Controller
           break
     return shown_all_attributes
 
-  validateForm: (data) ->
-
-    # remove all errors
-    $(data.form).parents().find('.error').removeClass('error')
-    $(data.form).parents().find('.help-inline').html('')
-
-    # show new errors
-    for key, msg of data.errors
-      $(data.form).parents().find('[name*="' + key + '"]').parents('div .control-group').addClass('error')
-      $(data.form).parents().find('[name*="' + key + '"]').parent().find('.help-inline').html(msg)
-
-    # set autofocus
-    $(data.form).parents().find('.error').find('input, textarea').first().focus()
-
-#    # enable form again
-#    if $(data.form).parents().find('.error').html()
-#      @formEnable(data.form)
-
 #  redirectToLogin: (data) ->
 #
 
@@ -562,17 +224,6 @@ class App.Controller extends Spine.Controller
     @navigate '#login'
     return false
 
-  clone = (obj) ->
-    if not obj? or typeof obj isnt 'object'
-      return obj
-
-    newInstance = new obj.constructor()
-
-    for key of obj
-      newInstance[key] = clone obj[key]
-
-    return newInstance
-
   clearInterval: (interval_id) =>
     # check global var
     if !@intervalID

app/assets/javascripts/app/controllers/_application_controller_form.js.coffee

@@ -0,0 +1,497 @@
+class App.ControllerForm extends App.Controller
+  constructor: (params) ->
+    for key, value of params
+      @[key] = value
+    @attribute_count = 0
+
+    @form = @formGen()
+#    @log 'form', @form
+    if @el
+      @el.append( @form )
+
+  html: =>
+    @form.html()
+
+  formGen: ->
+    fieldset = $('<fieldset>')
+
+    for attribute_clean in @model.configure_attributes
+      attribute = _.clone( attribute_clean )
+
+      if !attribute.readonly && ( !@required || @required && attribute[@required] )
+
+        @attribute_count = @attribute_count + 1
+
+        # add item
+        item = @formGenItem( attribute, @model.className, fieldset )
+        item.appendTo(fieldset)
+
+        # if password, add confirm password item
+        if attribute.type is 'password'
+
+          attribute.display = attribute.display + ' (confirm)'
+          attribute.name = attribute.name + '_confirm';
+
+          item = @formGenItem( attribute, @model.className, fieldset )
+          item.appendTo(fieldset)
+
+    # return form
+    return fieldset
+
+  ###
+
+  # input text field with max. 100 size
+  attribute_config = {
+    name:     'subject',
+    display:  'Subject',
+    tag:      'input',
+    type:     'text',
+    limit:    100,
+    null:     false,
+    default:  defaults['subject'],
+    class:    'span7'
+  }
+
+  # colection as relation with auto completion
+  attribute_config = {
+    name:           'customer_id',
+    display:        'Customer',
+    tag:            'autocompletion',
+    # auto completion params, endpoints, ui,...
+    type:           'text',
+    limit:          100,
+    null:           false,
+    relation:       'User',
+    autocapitalize: false,
+    help:           'Select the customer of the Ticket or create one.',
+    link:           '<a href="" class="customer_new">&raquo;</a>',
+    callback:       @userInfo
+    class:          'span7',
+  }
+
+  # colection as relation
+  attribute_config = {
+    name:       'ticket_priority_id',
+    display:    'Priority',
+    tag:        'select',
+    multiple:   false,
+    null:       false,
+    relation:   'TicketPriority',
+    default:    defaults['ticket_priority_id'],
+    translate:  true,
+    class:      'medium'
+  }
+
+  ###
+
+  formGenItem: (attribute_config, classname, form ) ->
+
+    attribute = _.clone( attribute_config )
+
+    # create item id
+    attribute.id = classname + '_' + attribute.name
+
+    # set autofocus
+    if @autofocus && @attribute_count is 1
+      attribute.autofocus = 'autofocus'
+
+    # set required option
+    if !attribute.null
+      attribute.required = 'required'
+    else
+      attribute.required = ''
+
+    # set multible option
+    if attribute.multiple
+      attribute.multiple = 'multiple'
+    else
+      attribute.multiple = ''
+
+    # set autocapitalize option
+    if attribute.autocapitalize is undefined || attribute.autocapitalize
+      attribute.autocapitalize = ''
+    else
+      attribute.autocapitalize = 'autocapitalize="off"'
+
+    # set autocomplete option
+    if attribute.autocomplete is undefined
+      attribute.autocomplete = ''
+    else
+      attribute.autocomplete = 'autocomplete="' + attribute.autocomplete + '"'
+
+    # set value
+    if @params
+      if attribute.name of @params
+        attribute.value = @params[attribute.name]
+
+    # set default value
+    else
+      if 'default' of attribute
+        attribute.value = attribute.default
+      else
+        attribute.value = ''
+
+    # build options list based on config
+    @_getConfigOptionList( attribute )
+
+    # build options list based on relation
+    @_getRelationOptionList( attribute )
+
+    # add null selection if needed
+    @_addNullOption( attribute )
+
+    # sort attribute.options
+    @_sortOptions( attribute )
+
+    # finde selected/checked item of list
+    @_selectedOptions( attribute )
+
+    # boolean
+    if attribute.tag is 'boolean'
+      
+      # build options list
+      if _.isEmpty(attribute.options)
+        attribute.options = [
+          { name: 'active', value: true } 
+          { name: 'inactive', value: false } 
+        ]
+
+      # update boolean types
+      for record in attribute.options
+        record.value = '{boolean}::' + record.value
+
+      # finde selected item of list
+      for record in attribute.options
+        if record.value is '{boolean}::' + attribute.value
+          record.selected = 'selected'
+
+      # return item
+      item = $( App.view('generic/select')( attribute: attribute ) )
+
+    # select
+    else if attribute.tag is 'select'
+      item = $( App.view('generic/select')( attribute: attribute ) )
+
+    # checkbox
+    else if attribute.tag is 'checkbox'
+      item = $( App.view('generic/checkbox')( attribute: attribute ) )
+
+    # radio
+    else if attribute.tag is 'radio'
+      item = App.view('generic/radio')( attribute: attribute )
+
+    # textarea
+    else if attribute.tag is 'textarea'
+      item = $( App.view('generic/textarea')( attribute: attribute ) )
+
+    # autocompletion
+    else if attribute.tag is 'autocompletion'
+      item = $( App.view('generic/autocompletion')( attribute: attribute ) )
+
+      a = ->
+        @local_attribute = '#' + attribute.id
+        @local_attribute_full = '#' + attribute.id + '_autocompletion'
+        @callback = attribute.callback
+  
+        b = (event, key) =>
+
+          # set html form attribute
+          $(@local_attribute).val(key)
+
+          # call calback
+          if @callback
+            params = App.ControllerForm.params(form)
+            @callback( params )
+        ###
+        $(@local_attribute_full).tagsInput(
+          autocomplete_url: '/user_search',
+          height: '30px',
+          width: '530px',
+          auto: {
+            source: '/user_search',
+            minLength: 2,
+            select: ( event, ui ) =>
+              @log 'selected', event, ui
+              b(event, ui.item.id)
+          }
+        )
+        ###
+        @log '111111', @local_attribute_full, item
+        $(@local_attribute_full).autocomplete(
+          source: '/user_search',
+          minLength: 2,
+          select: ( event, ui ) =>
+            @log 'selected', event, ui
+            b(event, ui.item.id)
+        )
+
+      @delay(a, 600)
+
+
+    # input
+    else
+      item = $( App.view('generic/input')( attribute: attribute ) )
+
+    if attribute.onchange
+      @log 'on change', attribute.name
+      if typeof attribute.onchange is 'function'
+        attribute.onchange(attribute)
+      else
+        for i of attribute.onchange
+          a = i.split(/__/)
+          if a[1]
+            if a[0] is attribute.name
+              @log 'aaa', i, a[0], attribute.id
+              @attribute = attribute
+              @classname = classname
+              @attributes_clean = attributes_clean
+              @change = a
+              b = =>
+                console.log 'aaa', @attribute
+                attribute = @attribute
+                change = @change
+                classname = @classname
+                attributes_clean = @attributes_clean
+                ui = @
+                $('#' + @attribute.id).bind('change', ->
+                  ui.log 'change', @, attribute, change
+                  ui.log change[0] + ' has changed - changing ' + change[1]
+
+                  item = $( ui.formGenItem(attribute, classname, attributes_clean) )
+                  ui.log item, classname
+                )
+              @delay(b, 800)
+#            if attribute.onchange[]
+
+    ui = @
+#    item.bind('focus', ->
+#      ui.log 'focus', attribute
+#    );
+    item.bind('change', ->
+      if ui.form_data
+        params = App.ControllerForm.params(@)
+        for i of ui.form_data
+          a = i.split(/__/)
+          if a[1] && a[0] is attribute.name
+            newListAttribute  = i
+            changedAttribute  = a[0]
+            toChangeAttribute = a[1]
+
+            # get new option list
+            newListAttributes = ui['form_data'][newListAttribute][ params['group_id'] ]
+
+            # find element to replace
+            for item in ui.model.configure_attributes
+              if item.name is toChangeAttribute
+                item.display = false
+                item['filter'][toChangeAttribute]['id'] = newListAttributes
+                if params[changedAttribute]
+                  item.default = params[toChangeAttribute]
+                if !item.default
+                  delete item['default']
+                newElement = ui.formGenItem( item, classname, form )
+
+            # replace new option list
+            form.find('[name="' + toChangeAttribute + '"]').replaceWith( newElement )
+    )
+
+    if !attribute.display
+      return item
+    else
+      a = $( App.view('generic/attribute')(
+        attribute: attribute,
+        item:      '',
+      ) )
+      a.find('.controls').prepend( item )
+      return a
+
+  # sort attribute.options
+  _sortOptions: (attribute) ->
+
+    return if !attribute.options
+
+    options_by_name = []
+    for i in attribute.options
+      options_by_name.push i['name'].toLowerCase()
+    options_by_name = options_by_name.sort()
+
+    options_new = []
+    options_new_used = {}
+    for i in options_by_name
+      for ii, vv in attribute.options
+        if !options_new_used[ ii['value'] ] && i.toString().toLowerCase() is ii['name'].toString().toLowerCase()
+          options_new_used[ ii['value'] ] = 1
+          options_new.push ii
+    attribute.options = options_new
+
+
+  _addNullOption: (attribute) ->
+    return if !attribute.options
+    return if !attribute.nulloption
+    attribute.options[''] = '-'
+    attribute.options.push {
+      name:  '-',
+      value: '',
+    }
+
+
+  _getConfigOptionList: (attribute) ->
+    return if !attribute.options
+    selection = attribute.options
+    attribute.options = []
+    for key of selection
+      attribute.options.push {
+        name:  selection[key],
+        value: key,
+      }
+
+
+  _getRelationOptionList: (attribute) ->
+
+    # build options list based on relation
+    return if !attribute.relation
+    return if !App[attribute.relation]
+
+    attribute.options = []
+
+    list = []
+    if attribute.filter && attribute.filter[attribute.name]
+      filter = attribute.filter[attribute.name]
+
+      # check all records
+      for record in App[attribute.relation].all()
+
+        # check all filter attributes
+        for key of filter
+
+          # check all filter values as array
+          if filter[key]
+            for value in filter[key]
+  
+              # if it's matching, use it for selection
+              if record[key] is value
+                list.push record
+    else
+      list = App[attribute.relation].all()
+
+    # build options list
+    @_buildOptionList( list, attribute )
+
+
+  # build options list
+  _buildOptionList: (list, attribute) ->
+
+    list.forEach( (item) =>
+
+      # if active or if active doesn't exist
+      if item.active || !( 'active' of item )
+        name = '???'
+        if item.name
+          name = item.name
+        else if item.firstname
+          name = item.firstname
+          if item.lastname
+            if name
+             name = name + ' '
+          name = name + item.lastname
+
+        name_new = name
+        if attribute.translate
+          name_new = Ti(name)
+        attribute.options.push {
+          name:  name_new,
+          value: item.id,
+          note:  item.note,
+        }
+    )
+
+
+  # set selected attributes
+  _selectedOptions: (attribute) ->
+
+    return if !attribute.options
+
+    for record in attribute.options
+      if typeof attribute.value is 'string' || typeof attribute.value is 'number' || typeof attribute.value is 'boolean'
+
+        # if name or value is matching
+        if record.value.toString() is attribute.value.toString() || record.name.toString() is attribute.value.toString()
+          record.selected = 'selected'
+          record.checked = 'checked'
+#          if record.name.toString() is attribute.value.toString()
+#            record.selected = 'selected'
+#            record.checked = 'checked'
+      if ( attribute.value && record.value && _.include(attribute.value, record.value) ) || ( attribute.value && record.name && _.include(attribute.value, record.name) )
+        record.selected = 'selected'
+        record.checked = 'checked'
+
+
+  # get all params of the form
+  @params: (form) ->
+    param = {}
+
+    # find form based on sub elements
+    if $(form).children()[0]
+      form = $(form).children().parents('form')
+
+    # find form based on parents next <form>
+    else if $(form).parents('form')[0]
+      form = $(form).parents('form')
+
+    # find form based on parents next <form>, not really good!
+    else if $(form).parents().find('form')[0]
+      form = $(form).parents().find('form')
+    else
+      console.log 'ERROR, no form found!', form
+
+    for key in form.serializeArray()
+      if param[key.name]
+        if typeof param[key.name] is 'string'
+          param[key.name] = [ param[key.name], key.value]
+        else
+          param[key.name].push key.value
+      else
+
+        # check boolean
+        boolean = key.value.split '::'
+        if boolean[0] is '{boolean}'
+          if boolean[1] is 'true'
+            key.value = true
+          else
+            key.value = false
+
+        param[key.name] = key.value
+
+#    console.log 'formParam', form, param
+    return param
+
+
+  @disable: (form) ->
+    console.log 'disable...', $(form.target).parent()
+    $(form.target).parent().find('[type="submit"]').attr('disabled', true)
+    $(form.target).parent().find('[type="reset"]').attr('disabled', true)
+
+
+  @enable: (form) ->
+    console.log 'enable...', $(form).parent()
+    $(form).parent().find('[type="submit"]').attr('disabled', false)
+    $(form).parent().find('[type="reset"]').attr('disabled', false)
+
+  @validate: (data) ->
+
+    # remove all errors
+    $(data.form).parents().find('.error').removeClass('error')
+    $(data.form).parents().find('.help-inline').html('')
+
+    # show new errors
+    for key, msg of data.errors
+      $(data.form).parents().find('[name*="' + key + '"]').parents('div .control-group').addClass('error')
+      $(data.form).parents().find('[name*="' + key + '"]').parent().find('.help-inline').html(msg)
+
+    # set autofocus
+    $(data.form).parents().find('.error').find('input, textarea').first().focus()
+
+#    # enable form again
+#    if $(data.form).parents().find('.error').html()
+#      @formEnable(data.form)
+

app/assets/javascripts/app/controllers/_application_controller_generic.js.coffee

@@ -10,10 +10,16 @@ class App.ControllerGenericNew extends App.ControllerModal
     @render()
   
   render: ->
-    @html App.view('generic/admin/new')(
+
-      form: @formGen( model: @genericObject ),
+    @html App.view('generic/admin/new')( head: @pageData.object )
-      head: @pageData.object
+
+    new App.ControllerForm(
+      el:         @el.find('#object_new'),
+      model:      @genericObject,
+      params:     @item,
+      autofocus:  true,
     )
+
     @modalShow()
 
   submit: (e) ->
@@ -34,7 +40,7 @@ class App.ControllerGenericNew extends App.ControllerModal
     errors = object.validate( form: true )
     if errors
       @log 'error new', errors
-      @validateForm( form: e.target, errors: errors )
+      @formValidate( form: e.target, errors: errors )
       return false
 
     # save object
@@ -64,10 +70,15 @@ class App.ControllerGenericEdit extends App.ControllerModal
       @genericObject.fetch( id: params.id) 
     
   render: ->
-    @html App.view('generic/admin/edit')(
+    @html App.view('generic/admin/edit')( head: @pageData.object )
-      form: @formGen( model: @genericObject, params: @item ),
+
-      head: @pageData.object
+    new App.ControllerForm(
+      el:         @el.find('#object_edit'),
+      model:      @genericObject,
+      params:     @item,
+      autofocus:  true,
     )
+
     @modalShow()
 
   submit: (e) ->
@@ -79,7 +90,7 @@ class App.ControllerGenericEdit extends App.ControllerModal
     errors = @item.validate( form: true )
     if errors
       @log 'error new', errors
-      @validateForm( form: e.target, errors: errors )
+      @formValidate( form: e.target, errors: errors )
       return false
 
     @log 'save....'
@@ -105,7 +116,6 @@ class App.ControllerGenericIndex extends App.Controller
     # set controller to active
     Config['ActiveController'] = @pageData.navupdate
 
-
     # set title
     @title @pageData.title
 
@@ -130,6 +140,8 @@ class App.ControllerGenericIndex extends App.Controller
       @render()
 
       # fetch all
+#      @log 'oooo', @genericObject.model
+#      @genericObject.deleteAll()
       @genericObject.fetch()
     else
       @render()

app/assets/javascripts/app/controllers/_channel/email.js.coffee

@@ -53,12 +53,14 @@ class App.ChannelEmailInboundEdit extends App.ControllerModal
       { name: 'group_id', display: 'Group',    tag: 'select',   multiple: false, null: false, filter: @edit_form, nulloption: false, relation: 'Group', class: 'span4', default: data['group_id']  },
       { name: 'active',   display: 'Active',   tag: 'select',   multiple: false, null: false, options: { true: 'yes', false: 'no' } , class: 'span4', default: data['active'] },
     ]
-    form = @formGen( model: { configure_attributes: configure_attributes, className: '' } )
-
     @html App.view('generic/admin/new')(
-      form: form,
       head: 'New Channel'
     )
+    new App.ControllerForm(
+      el: @el.find('#object_new'),
+      model: { configure_attributes: configure_attributes, className: '' },
+      autofocus: true,
+    )
     @modalShow()
 
   submit: (e) =>
@@ -90,7 +92,7 @@ class App.ChannelEmailInboundEdit extends App.ControllerModal
     # show errors in form
     if errors
       @log 'error new', errors
-      @validateForm( form: e.target, errors: errors )
+      @formValidate( form: e.target, errors: errors )
       return false
 
     # save object
@@ -175,10 +177,16 @@ class App.ChannelEmailOutbound extends App.Controller
             adapter_used = channel.adapter
             channel_used = channel
 
+    @html App.view('channel/email_outbound')()
+
     configure_attributes = [
       { name: 'adapter', display: 'Send Mails via', tag: 'select', multiple: false, null: false, options: adapters , class: 'span4', default: adapter_used },
     ]
-    form_adapter = @formGen( model: { configure_attributes: configure_attributes, className: '' } )
+    new App.ControllerForm(
+      el: @el.find('#form-email-adapter'),
+      model: { configure_attributes: configure_attributes, className: '' },
+      autofocus: true,
+    )
 
     if adapter_used is 'SMTP'
       configure_attributes = [
@@ -187,14 +195,12 @@ class App.ChannelEmailOutbound extends App.Controller
         { name: 'password', display: 'Password', tag: 'input',    type: 'password', limit: 120, null: true, class: 'span4', autocapitalize: false, default: (channel_used['options']&&channel_used['options']['password']) },
         { name: 'ssl',      display: 'SSL',      tag: 'select',   multiple: false, null: false, options: { true: 'yes', false: 'no' } , class: 'span4', default: (channel_used['options']&&channel_used['options']['ssl']) },
       ]
-      form_adapter_settings = @formGen( model: { configure_attributes: configure_attributes, className: '' } )
+      new App.ControllerForm(
-
+        el: @el.find('#form-email-adapter-settings'),
-    html = App.view('channel/email_outbound')(
+        model: { configure_attributes: configure_attributes, className: '' },
-      form_adapter:          form_adapter,
+        autofocus: true,
-      form_adapter_settings: form_adapter_settings,
       )
-    html = $(html)
+
-    @html html
 
   toggle: (e) =>
 

app/assets/javascripts/app/controllers/_dashboard/ticket.js.coffee

@@ -222,9 +222,12 @@ class Settings extends App.ControllerModal
         class:      'medium',
       },
     ]
-    form = @formGen( model: { configure_attributes: @configure_attributes_article } )
 
-    @el.find('.setting').append(form)
+    new App.ControllerForm(
+      el: @el.find('#form-setting'),
+      model: { configure_attributes: @configure_attributes_article },
+      autofocus: false,
+    )
 
     @modalShow()
 

app/assets/javascripts/app/controllers/_settings/area.js.coffee

@@ -39,18 +39,22 @@ class App.SettingsAreaItem extends App.Controller
 
     # form
     @configure_attributes = @setting.options['form']
-    form = @formGen( model: { configure_attributes: @configure_attributes, className: '' }, autofocus: false )
 
     # item
     @html App.view('settings/item')(
       setting: @setting,
-      form:    form,
+    )
+
+    new App.ControllerForm(
+      el: @el.find('#form-item'),
+      model: { configure_attributes: @configure_attributes, className: '' },
+      autofocus: false,
     )
 
   update: (e) =>
     e.preventDefault()
     params = @formParam(e.target)
-    @log 'submit', @setting, params, e.target
+    @log 'submit', @setting, params, e.target, typeof @setting.state.value
     if typeof @setting.state.value is 'object'
       state = {
         value: params

app/assets/javascripts/app/controllers/agent_ticket_create.js.coffee

@@ -86,9 +86,9 @@ class Index extends App.Controller
     # set defaults
     defaults = template['options'] || {}
     if !( 'ticket_state_id' of defaults )
-      defaults['ticket_state_id'] = App.TicketState.findByAttribute( 'name', 'new' )
+      defaults['ticket_state_id'] = App.TicketState.findByAttribute( 'name', 'new' ).id
     if !( 'ticket_priority_id' of defaults )
-      defaults['ticket_priority_id'] = App.TicketPriority.findByAttribute( 'name', '2 normal' )
+      defaults['ticket_priority_id'] = App.TicketPriority.findByAttribute( 'name', '2 normal' ).id
 
     # remember customers
     if $('#create_customer_id').val()
@@ -100,17 +100,24 @@ class Index extends App.Controller
 
     # generate form    
     configure_attributes = [
-      { name: 'customer_id',        display: 'Customer', tag: 'autocompletion', type: 'text', limit: 100, null: false, relation: 'User', class: 'span7', autocapitalize: false, help: 'Select the customer of the Ticket or create one.', link: '<a href="" class="customer_new">&raquo;</a>', callback: @userInfo },
+      { name: 'customer_id',        display: 'Customer', tag: 'autocompletion', type: 'text', limit: 200, null: false, relation: 'User', class: 'span7', autocapitalize: false, help: 'Select the customer of the Ticket or create one.', link: '<a href="" class="customer_new">&raquo;</a>', callback: @localUserInfo },
       { name: 'group_id',           display: 'Group',    tag: 'select',   multiple: false, null: false, filter: @edit_form, nulloption: true, relation: 'Group', default: defaults['group_id'], class: 'span7',  },
       { name: 'owner_id',           display: 'Owner',    tag: 'select',   multiple: false, null: true,  filter: @edit_form, nulloption: true, relation: 'User',  default: defaults['owner_id'], class: 'span7',  },
-      { name: 'subject',            display: 'Subject',  tag: 'input',    type: 'text', limit: 100, null: false, default: defaults['subject'], class: 'span7', },
+      { name: 'subject',            display: 'Subject',  tag: 'input',    type: 'text', limit: 200, null: false, default: defaults['subject'], class: 'span7', },
       { name: 'body',               display: 'Text',     tag: 'textarea', rows: 6,                  null: false, default: defaults['body'],    class: 'span7', },
       { name: 'ticket_state_id',    display: 'State',    tag: 'select',   multiple: false, null: false, filter: @edit_form, relation: 'TicketState',    default: defaults['ticket_state_id'],    translate: true, class: 'medium' },
       { name: 'ticket_priority_id', display: 'Priority', tag: 'select',   multiple: false, null: false, filter: @edit_form, relation: 'TicketPriority', default: defaults['ticket_priority_id'], translate: true, class: 'medium' },
     ]
-    @html App.view('agent_ticket_create')(
+    @html App.view('agent_ticket_create')( head: 'New Ticket' )
-      head: 'New Ticket',
+
-      form: @formGen( model: { configure_attributes: configure_attributes, className: 'create' } ),
+    new App.ControllerForm(
+      el: @el.find('#form_create'),
+      model: {
+        configure_attributes: configure_attributes,
+        className:            'create',
+      },
+      autofocus: true,
+      form_data: @edit_form,
     )
 
     # add elastic to textarea
@@ -131,6 +138,9 @@ class Index extends App.Controller
       template_id: template['id'],
     )
 
+  localUserInfo: (params) =>
+    @userInfo( user_id: params.customer_id )
+
   user_new: (e) =>
     e.preventDefault()
     new UserNew()
@@ -178,7 +188,7 @@ class Index extends App.Controller
     # show errors in form
     if errors
       @log 'error new', errors
-      @validateForm( form: e.target, errors: errors )
+      @formValidate( form: e.target, errors: errors )
 
     # save ticket, create article
     else 
@@ -215,10 +225,15 @@ class UserNew extends App.ControllerModal
 
   render: ->
 
-    @html App.view('agent_user_create')(
+    @html App.view('agent_user_create')( head: 'New User' )
-      head: 'New User',
+
-      form: @formGen( model: App.User, required: 'quick' ),
+    new App.ControllerForm(
+      el: @el.find('#form-user'),
+      model: App.User,
+      required: 'quick',
+      autofocus: true,
     )
+
     @modalShow()
 
   submit: (e) ->
@@ -241,7 +256,7 @@ class UserNew extends App.ControllerModal
     errors = user.validate()
     if errors
       @log 'error new', errors
-      @validateForm( form: e.target, errors: errors )
+      @formValidate( form: e.target, errors: errors )
       return
 
     # save user

app/assets/javascripts/app/controllers/agent_ticket_customer.js.coffee

@@ -9,9 +9,15 @@ class App.TicketCustomer extends App.ControllerModal
       { name: 'customer_id', display: 'Customer', tag: 'autocompletion', type: 'text', limit: 100, null: false, relation: 'User', class: 'span5', autocapitalize: false, help: 'Select the new customer of the Ticket.', },
     ]
 
-    @html App.view('agent_ticket_customer')(
+    @html App.view('agent_ticket_customer')()
-#      head: 'New User',
+
-      form: @formGen( model: { configure_attributes: configure_attributes, className: 'update' } ),
+    new App.ControllerForm(
+      el: @el.find('#form-customer'),
+      model: {
+        configure_attributes: configure_attributes,
+        className:            'update',
+      },
+      autofocus: true,
     )
     @modalShow()
 

app/assets/javascripts/app/controllers/agent_ticket_merge.js.coffee

@@ -4,10 +4,7 @@ class App.TicketMerge extends App.ControllerModal
     @render()
 
   render: -> 
-    @html App.view('agent_ticket_merge')(
+    @html App.view('agent_ticket_merge')()
-#      head: 'New User',
-#      form: @formGen( model: App.User, required: 'quick' ),
-    )
     @modalShow()
 
   submit: (e) =>

app/assets/javascripts/app/controllers/agent_ticket_zoom.js.coffee

@@ -355,7 +355,7 @@ class Index extends App.Controller
 
 #    errors = article.validate()
 #    @log 'error new', errors
-#    @validateForm( form: e.target, errors: errors )
+#    @formValidate( form: e.target, errors: errors )
     return false
 
 class Article extends App.Controller

app/assets/javascripts/app/controllers/customer_ticket_new.js.coffee

@@ -94,9 +94,16 @@ class Index extends App.Controller
 #      { name: 'ticket_state_id',    display: 'State',    tag: 'select',   multiple: false, null: false, filter: @edit_form, relation: 'TicketState',    default: defaults['ticket_state_id'],    translate: true, class: 'medium' },
 #      { name: 'ticket_priority_id', display: 'Priority', tag: 'select',   multiple: false, null: false, filter: @edit_form, relation: 'TicketPriority', default: defaults['ticket_priority_id'], translate: true, class: 'medium' },
     ]
-    @html App.view('agent_ticket_create')(
+    @html App.view('agent_ticket_create')( head: 'New Ticket' )
-      head: 'New Ticket',
+
-      form: @formGen( model: { configure_attributes: configure_attributes, className: 'create' } ),
+    new App.ControllerForm(
+      el: @el.find('#form_create'),
+      model: {
+        configure_attributes: configure_attributes,
+        className:            'create',
+      },
+      autofocus: true,
+      form_data: @edit_form,
     )
 
     # add elastic to textarea
@@ -113,6 +120,7 @@ class Index extends App.Controller
 
     # get params
     params = @formParam(e.target)
+    @log 'paramssss', params
 
     # set customer id
     params.customer_id = Session['id']
@@ -159,7 +167,7 @@ class Index extends App.Controller
     # show errors in form
     if errors
       @log 'error new', errors
-      @validateForm( form: e.target, errors: errors )
+      @formValidate( form: e.target, errors: errors )
       
     # save ticket, create article
     else 

app/assets/javascripts/app/controllers/getting_started.js.coffee

@@ -48,10 +48,23 @@ class Index extends App.Controller
       @navigate '#login'
 
     @html App.view('getting_started')(
-      form_agent:  @formGen( model: App.User, required: 'invite_agent' ),
-      form_master: @formGen( model: App.User, required: 'signup' ),
       master_user: @master_user,
     )
+
+    new App.ControllerForm(
+      el: @el.find('#form-master'),
+      model: App.User,
+      required: 'signup',
+      autofocus: true,
+    )
+    new App.ControllerForm(
+      el: @el.find('#form-agent'),
+      model: App.User,
+      required: 'invite_agent',
+      autofocus: true,
+    )
+
+
     if !@master_user
       @el.find('.agent_user').removeClass('hide')
 
@@ -67,7 +80,7 @@ class Index extends App.Controller
     @params.invite = true
 
     # find agent role
-    role = App.Role.findByAttribute("name", "Agent")
+    role = App.Role.findByAttribute('name', 'Agent')
     if role
       @params.role_ids = role.id
     else
@@ -80,7 +93,7 @@ class Index extends App.Controller
     errors = user.validate()
     if errors
       @log 'error new', errors
-      @validateForm( form: e.target, errors: errors )
+      @formValidate( form: e.target, errors: errors )
       return false
 
     # save user

app/assets/javascripts/app/controllers/reset_password.js.coffee

@@ -21,8 +21,12 @@ class Index extends App.Controller
       { name: 'username', display: 'Enter your username or email address:', tag: 'input', type: 'text', limit: 100, null: false, class: 'input span4',  },
     ]
 
-    @html App.view('reset_password')(
+    @html App.view('reset_password')()
-      form: @formGen( model: { configure_attributes: configure_attributes } ),
+
+    new App.ControllerForm(
+      el: @el.find('#form-password'),
+      model: { configure_attributes: configure_attributes },
+      autofocus: true,
     )
 
   submit: (e) ->
@@ -80,8 +84,12 @@ class Verify extends App.Controller
       { name: 'password', display: 'Password', tag: 'input', type: 'password', limit: 100, null: false, class: 'input span4',  },
     ]
 
-    @html App.view('reset_password_change')(
+    @html App.view('reset_password_change')()
-      form: @formGen( model: { configure_attributes: configure_attributes } ),
+
+    new App.ControllerForm(
+      el: @el.find('#form-password-change'),
+      model: { configure_attributes: configure_attributes },
+      autofocus: true,
     )
 
   render_failed: ->

app/assets/javascripts/app/controllers/signup.js.coffee

@@ -24,8 +24,13 @@ class Index extends App.Controller
       if item.name is 'password'
         item.null = false
 
-    @html App.view('signup')(
+    @html App.view('signup')()
-      form: @formGen( model: App.User, required: 'signup' ),
+
+    new App.ControllerForm(
+      el: @el.find('#form-signup'),
+      model: App.User,
+      required: 'signup',
+      autofocus: true,
     )
 
   cancel: ->
@@ -55,7 +60,7 @@ class Index extends App.Controller
     errors = user.validate()
     if errors
       @log 'error new', errors
-      @validateForm( form: e.target, errors: errors )
+      @formValidate( form: e.target, errors: errors )
       return false
 
     # save user

app/assets/javascripts/app/controllers/template.js.coffee

@@ -29,7 +29,6 @@ class App.TemplateUI extends App.Controller
     @configure_attributes = [
       { name: 'template_id', display: '', tag: 'select', multiple: false, null: true, nulloption: true, relation: 'Template', class: 'span2', default: @template_id  },
     ]
-    form = @formGen( model: { configure_attributes: @configure_attributes, className: '' } )
 
     template = {}
     if @template_id
@@ -37,10 +36,13 @@ class App.TemplateUI extends App.Controller
 
     # insert data
     @html App.view('template')(
-      form:     form,
       template: template,
     )
-
+    new App.ControllerForm(
+      el: @el.find('#form-template'),
+      model: { configure_attributes: @configure_attributes, className: '' },
+      autofocus: false,
+    )
 
   delete: (e) =>
     e.preventDefault()

app/assets/javascripts/app/lib/i18n.js.coffee

@@ -1,5 +1,9 @@
 $ = jQuery.sub()
 
+# create dumy function till i18n is loaded
+window.T = (text) ->
+  return text
+
 class App.i18n
 
   constructor: ->

app/assets/javascripts/app/lib/websocket.js.coffee

@@ -22,11 +22,13 @@ class App.WebSocket
 # The actual Singleton class
 class _Singleton extends Spine.Controller
   queue: []
+  supported: true
 
   constructor: (@args) ->
     @connect()
 
   send: (data) =>
+    return if !@supported
     console.log 'ws:send trying', data, @ws, @ws.readyState
 
     # A value of 0 indicates that the connection has not yet been established.
@@ -41,6 +43,7 @@ class _Singleton extends Spine.Controller
       @ws.send(string)
 
   auth: (data) =>
+    return if !@supported
 
     # logon websocket
     data = {
@@ -50,9 +53,13 @@ class _Singleton extends Spine.Controller
     @send(data)
 
   close: =>
+    return if !@supported
+
     @ws.close()
 
   ping: =>
+    return if !@supported
+
     console.log 'send websockend ping'
     @send( { action: 'ping' } )
 
@@ -65,6 +72,8 @@ class _Singleton extends Spine.Controller
     @check_id = @delay check, 120000
 
   pong: ->
+    return if !@supported
+
     console.log 'received websockend ping'
 
     # test again after 1 min
@@ -77,6 +86,7 @@ class _Singleton extends Spine.Controller
       @error = new App.ErrorModal(
         message: 'Sorry, no websocket support!'
       )
+      @supported = false
       return
 
     protocol = 'ws://'

app/assets/javascripts/app/views/agent_ticket_create.jst.eco

@@ -1,11 +1,9 @@
 <div class="page-header">
   <h1><%- T('New Ticket') %> <small></small></h1>
 </div>
-
 <form class="form-horizontal">
   <div class="row">
-    <div class="span9">
+    <div class="span9" id="form_create">
-      <%- @form %>
       <!--
         <legend>Example form legend</legend>
       -->

app/assets/javascripts/app/views/agent_ticket_customer.jst.eco

@@ -3,9 +3,7 @@
   <a href="#" class="close">&times;</a>
   <h3><%- T('Change Customer') %></h3>
 </div>
-<div class="modal-body">
+<div class="modal-body" id="form-customer"></div>
-  <%- @form %>
-</div>
 <div class="modal-footer">
   <button type="submit" class="btn btn-primary"><%- T('Submit') %></button>
 </div>

app/assets/javascripts/app/views/agent_user_create.jst.eco

@@ -3,9 +3,7 @@
     <a href="#" class="close">&times;</a>
     <h3><%- T(@head) %></h3>
   </div>
-  <div class="modal-body">
+  <div class="modal-body" id="form-user"></div>
-    <%- @form %>
-  </div>
   <div class="modal-footer">
     <button class="btn btn-primary submit"><%- T('Submit') %></button>
     <button class="btn secondary cancel"><%- T('Cancel') %></button>

app/assets/javascripts/app/views/channel/email_outbound.jst.eco

@@ -1,5 +1,5 @@
 <form class="form-horizontal" id="mail_adapter">
-  <%- @form_adapter %>
+  <div id="form-email-adapter"></div>
-  <%- @form_adapter_settings %>
+  <div id="form-email-adapter-settings"></div>
   <button data-type="" type="submit" class="btn">submit</botton>
 </form>

app/assets/javascripts/app/views/dashboard/ticket_settings.jst.eco

@@ -1,13 +1,13 @@
+<form class="form-horizontal">
 <div class="modal-header">
   <a href="#" class="close">&times;</a>
   <h3><%- T('Edit') %>: <%- T(@overview.meta.name) %></h3>
 </div>
 <div class="modal-body">
-  <form class="form-horizontal">
+    <div id="form-setting"></div>
-    <div class="setting"></div>
-  </form>
 </div>
 <div class="modal-footer">
   <button class="btn btn-primary submit"><%- T('Submit') %></button>
   <button class="btn cancel"><%- T('Cancel') %></button>
 </div>
+</form>

app/assets/javascripts/app/views/generic/admin/edit.jst.eco

@@ -3,9 +3,7 @@
     <a href="#" class="close">&times;</a>
     <h3><%- T('Edit') %>: <%- T(@head) %></h3>
   </div>
-  <div class="modal-body">
+  <div class="modal-body" id="object_edit"></div>
-    <%- @form %>
-  </div>
   <div class="modal-footer">
     <button class="btn btn-primary submit"><%- T('Submit') %></button>
     <button class="btn cancel"><%- T('Cancel') %></button>

app/assets/javascripts/app/views/generic/admin/new.jst.eco

@@ -3,9 +3,7 @@
     <a href="#" class="close">&times;</a>
     <h3><%- T('Neu') %>: <%- T(@head) %></h3>
   </div>
-  <div class="modal-body">
+  <div class="modal-body" id="object_new"></div>
-    <%- @form %>
-  </div>
   <div class="modal-footer">
     <button class="btn btn-primary submit"><%- T('Submit') %></button>
     <button class="btn cancel"><%- T('Cancel') %></button>

app/assets/javascripts/app/views/getting_started.jst.eco

@@ -16,16 +16,14 @@
     <% if @master_user: %>
       <div class="span6 master_user">
         <h2><%- T('Master Agent') %></h2>
-        <form class="form-stacked">
+        <form class="form-stacked" id="form-master">
-          <%- @form_master %>
           <button class="btn btn-primary submit"><%- T('Next...') %></button>
         </form>
       </div>
     <% end %>
       <div class="span6 agent_user hide">
         <h2><%- T('Invite Agents') %></h2>
-        <form class="form-stacked">
+        <form class="form-stacked" id="form-agent">
-          <%- @form_agent %>
           <button class="btn btn-primary submit"><%- T('Send Invitation') %></button>
         </form>
       </div>

app/assets/javascripts/app/views/reset_password.jst.eco

@@ -1,11 +1,8 @@
 <div class="hero-unit">
   <h2><%- T('Forgot your password?') %><small></small></h2>
-
   <div class="container">
     <form>
-      <p>
+      <p id="form-password"></p>
-        <%- @form %>
-      </p>
       <a href="#/" class="btn cancel"><%- T('Cancel') %></a>
       <button class="btn btn-primary submit"><%- T('Submit') %></button>
     </form>

app/assets/javascripts/app/views/reset_password_change.jst.eco

@@ -2,9 +2,7 @@
   <h2><%- T('Choose your new password.') %><small></small></h2>
   <div class="container">
     <form>
-      <p>
+      <p id="form-password-change"></p>
-        <%- @form %>
-      </p>
       <button class="btn btn-primary submit"><%- T('Submit') %></button>
     </form>
   </div>

app/assets/javascripts/app/views/settings/item.jst.eco

@@ -1,7 +1,7 @@
 <form class="">
   <h2><%- T(@setting.title) %></h2>
   <p><%- T(@setting.description) %></p>
-  <%- @form %>
+  <div id="form-item"></div>
   <button type="submit" class="btn"><%- T('Submit') %></button>
 </form>
 <hr/>

app/assets/javascripts/app/views/signup.jst.eco

@@ -1,11 +1,8 @@
 <div class="hero-unit">
   <h1><%- T('Join') %> <%= Config.product_name %><small></small></h1>
-
   <div class="container">
     <form class="form-horizontal">
-      <p>
+      <p id="form-signup"></p>
-        <%- @form %>
-      </p>
       <a href="#/" class="btn cancel"><%- T('Cancel') %></a>
       <button class="btn btn-primary submit"><%- T('Create my account') %></button>
     </form>

app/assets/javascripts/app/views/template.jst.eco

@@ -1,6 +1,6 @@
 <div class="well">
   <h3><%- T('Templates') %></h3>
-  <%- @form %>
+  <div id="form-template"></div>
   <!--<button type="submit" class="btn" data-type="template_edit"><%- T('Edit') %></button>-->
   <button type="submit" class="btn" data-type="template_delete"><%- T('Delete') %></button>
   <button type="submit" class="btn" data-type="template_select"><%- T('Apply') %></button>