Added even more date/datetime tests. Added support for hidden date fields.

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

@@ -396,6 +396,17 @@ class App.ControllerForm extends App.Controller
             errors.year = 'invalid'
 
         if !_.isEmpty(errors)
+
+          # if field is required, if not do not show error
+          if year is '' && day is '' && month
+            if attribute.null
+              e.preventDefault()
+              e.stopPropagation()
+              return
+            else
+              item.closest('.form-group').find('.help-inline').text( 'is required' )
+
+          # show invalid options
           for key, value of errors
             item.closest('.form-group').addClass('has-error')
             item.closest('.form-group').find("[name=\"#{fieldPrefix}___#{key}\"]").addClass('has-error')
@@ -556,6 +567,17 @@ class App.ControllerForm extends App.Controller
             errors.minute = 'invalid'
 
         if !_.isEmpty(errors)
+
+          # if field is required, if not do not show error
+          if year is '' && day is '' && month is '' && hour is '' && minute is ''
+            if attribute.null
+              e.preventDefault()
+              e.stopPropagation()
+              return
+            else
+              item.closest('.form-group').find('.help-inline').text( 'is required' )
+
+          # show invalid options
           for key, value of errors
             item.closest('.form-group').addClass('has-error')
             item.closest('.form-group').find("[name=\"#{fieldPrefix}___#{key}\"]").addClass('has-error')
@@ -2302,17 +2324,22 @@ class App.ControllerForm extends App.Controller
           month       = param[ "#{dateKey}month" ]
           day         = param[ "#{dateKey}day" ]
           timezone    = (new Date()).getTimezoneOffset()/60
-          if year && month && day
+          if year && month && day && day && !lookupForm.find('[data-name="' + namespace[0] + '"]').hasClass('is-hidden')
             format = (number) ->
               if parseInt(number) < 10
                 number = "0#{number}"
               number
             try
               time = new Date( Date.parse( "#{year}-#{format(month)}-#{format(day)}T00:00:00Z" ) )
+              if time && time.toString() is 'Invalid Date'
+                throw "Invalid Date #{year}-#{format(month)}-#{format(day)}"
               time.setMinutes( time.getMinutes() + time.getTimezoneOffset() )
-              param[ namespace[0] ] = time.toISOString()
+              param[ namespace[0] ] = "#{time.getFullYear()}-#{format(time.getMonth()+1)}-#{format(time.getDate())}"
             catch err
+              param[ namespace[0] ] = undefined
               console.log('ERR', err)
+          else
+            param[ namespace[0] ] = undefined
 
         #console.log('T', time, time.getHours(), time.getMinutes())
 
@@ -2333,17 +2360,22 @@ class App.ControllerForm extends App.Controller
           hour        = param[ "#{datetimeKey}hour" ]
           minute      = param[ "#{datetimeKey}minute" ]
           timezone    = (new Date()).getTimezoneOffset()/60
-          if year && month && day && hour && minute
+          if year && month && day && hour && minute && !lookupForm.find('[data-name="' + namespace[0] + '"]').hasClass('is-hidden')
             format = (number) ->
               if parseInt(number) < 10
                 number = "0#{number}"
               number
             try
               time = new Date( Date.parse( "#{year}-#{format(month)}-#{format(day)}T#{format(hour)}:#{format(minute)}:00Z" ) )
+              if time && time.toString() is 'Invalid Date'
+                throw "Invalid Date #{year}-#{format(month)}-#{format(day)}T#{format(hour)}:#{format(minute)}:00Z"
               time.setMinutes( time.getMinutes() + time.getTimezoneOffset() )
               param[ namespace[0] ] = time.toISOString()
             catch err
+              param[ namespace[0] ] = undefined
               console.log('ERR', err)
+          else
+            param[ namespace[0] ] = undefined
 
         #console.log('T', time, time.getHours(), time.getMinutes())
 

public/assets/tests/form-validation.js

@@ -110,7 +110,13 @@ test( "datetime validation check", function() {
     params: defaults,
   });
 
+  // check params
   params = App.ControllerForm.params( el )
+  test_params = {
+    datetime1: undefined,
+  }
+  deepEqual( params, test_params, 'params check' )
+
   errors = form.validate(params)
   test_errors = {
     datetime1: "is required",
@@ -129,7 +135,14 @@ test( "datetime validation check", function() {
   el.find('[name="{datetime}datetime1___hour"]').val('12')
   el.find('[name="{datetime}datetime1___minute"]').val('42')
 
+  // check params
   params = App.ControllerForm.params( el )
+  test_params = {
+    datetime1: "2015-01-01T11:42:00.000Z",
+  }
+  deepEqual( params, test_params, 'params check' )
+
+  // check errors
   errors = form.validate(params)
   test_errors = undefined
   deepEqual( errors, test_errors, 'validation errors check' )
@@ -172,6 +185,14 @@ test( "date validation check", function() {
   });
 
   params = App.ControllerForm.params( el )
+
+  // check params
+  params = App.ControllerForm.params( el )
+  test_params = {
+    date1: undefined,
+  }
+  deepEqual( params, test_params, 'params check' )
+
   errors = form.validate(params)
   test_errors = {
     date1: "is required",
@@ -182,30 +203,46 @@ test( "date validation check", function() {
   equal( el.find('[data-name="date1"]').closest('.form-group').hasClass('has-error'), true, 'check date1 has-error')
   equal( el.find('[data-name="date1"]').closest('.form-group').find('.help-inline').text(), 'is required', 'check date1 error message')
 
-
   // set new values
   el.find('[name="{date}date1___day"]').val('1')
   el.find('[name="{date}date1___month"]').val('1')
   el.find('[name="{date}date1___year"]').val('2015')
+
+  // check params
   params = App.ControllerForm.params( el )
+  test_params = {
+    date1: "2015-01-01",
+  }
+  deepEqual( params, test_params, 'params check' )
+
+  // check errors
   errors = form.validate(params)
   test_errors = undefined
   deepEqual( errors, test_errors, 'validation errors check' )
-
   App.ControllerForm.validate( { errors: errors, form: el } )
-
   equal( el.find('[data-name="date1"]').closest('.form-group').hasClass('has-error'), false, 'check date1 has-error')
   equal( el.find('[data-name="date1"]').closest('.form-group').find('.help-inline').text(), '', 'check date1 error message')
 
+  // set invalid values
   el.find('[name="{date}date1___day"]').val('47')
   el.find('[name="{date}date1___month"]').val('1')
   el.find('[name="{date}date1___year"]').val('2015')
+
+  // check params
   params = App.ControllerForm.params( el )
+  test_params = {
+    date1: undefined,
+  }
+  deepEqual( params, test_params, 'params check' )
+
+  // check errors
   errors = form.validate(params)
   test_errors = {
     date1: "is required",
   }
   deepEqual( errors, test_errors, 'validation errors check' )
   App.ControllerForm.validate( { errors: errors, form: el } )
+  equal( el.find('[data-name="date1"]').closest('.form-group').hasClass('has-error'), true, 'check date1 has-error')
+  equal( el.find('[data-name="date1"]').closest('.form-group').find('.help-inline').text(), '', 'check date1 error message')
 
 });

public/assets/tests/form.js

@@ -36,7 +36,7 @@ test( "form elements check", function() {
         { name: 'richtext1', display: 'Richtext1', tag: 'richtext', limit: 100, null: true, upload: true, default: defaults['richtext1']  },
         { name: 'richtext2', display: 'Richtext2', tag: 'richtext', limit: 100, null: true, upload: true, default: defaults['richtext2']  },
         { name: 'datetime1', display: 'Datetime1', tag: 'datetime', null: true, default: defaults['datetime1']  },
-        { name: 'datetime2', display: 'Datetime2', tag: 'datetime', null: true, default: defaults['datetime2']  },
+        { name: 'datetime2', display: 'Datetime2', tag: 'datetime', null: false, default: defaults['datetime2']  },
       ]
     },
     autofocus: true
@@ -119,6 +119,9 @@ test( "form params check", function() {
     richtext7: "<div>&nbsp;<div>&nbsp;\n</div>  \n</div>",
     richtext8: '<div>lalu <i>b</i> lalu</div>',
     datetime1: new Date( Date.parse('2015-01-11T12:40:00Z') ),
+    datetime3: new Date( Date.parse('2015-01-11T12:40:00Z') ),
+    date1:     '2015-01-11',
+    date3:     '2015-01-11',
     active1:   true,
     active2:   false,
   }
@@ -150,6 +153,12 @@ test( "form params check", function() {
         { name: 'richtext8', display: 'Richtext8', tag: 'richtext', maxlength: 100, null: true, type: 'textonly', multiline: false, default: defaults['richtext8']  },
         { name: 'datetime1', display: 'Datetime1', tag: 'datetime', null: true, default: defaults['datetime1']  },
         { name: 'datetime2', display: 'Datetime2', tag: 'datetime', null: true, default: defaults['datetime2']  },
+        { name: 'datetime3', display: 'Datetime3', tag: 'datetime', null: false, default: defaults['datetime3']  },
+        { name: 'datetime4', display: 'Datetime4', tag: 'datetime', null: false, default: defaults['datetime4']  },
+        { name: 'date1',     display: 'Date1',     tag: 'date', null: true, default: defaults['date1']  },
+        { name: 'date2',     display: 'Date2',     tag: 'date', null: true, default: defaults['date2']  },
+        { name: 'date3',     display: 'Date3',     tag: 'date', null: false, default: defaults['date3']  },
+        { name: 'date4',     display: 'Date4',     tag: 'date', null: false, default: defaults['date4']  },
         { name: 'active1', display: 'Active1',  tag: 'boolean', type: 'boolean', default: defaults['active1'], null: false },
         { name: 'active2', display: 'Active2',  tag: 'boolean', type: 'boolean', default: defaults['active2'], null: false },
       ],
@@ -231,6 +240,13 @@ test( "form params check", function() {
     richtext7: '',
     richtext8: '<div>lalu <i>b</i> lalu</div>',
     datetime1: '2015-01-11T12:40:00.000Z',
+    datetime2: undefined,
+    datetime3: '2015-01-11T12:40:00.000Z',
+    datetime4: undefined,
+    date1: '2015-01-11',
+    date2: undefined,
+    date3: '2015-01-11',
+    date4: undefined,
     active1: true,
     active2: false,
   }
@@ -333,8 +349,12 @@ test( "form dependend fields check", function() {
     select2: false,
     selectmulti2: [ false, true ],
     selectmultioption1: false,
+    datetime1: new Date( Date.parse('2015-01-11T12:40:00Z') ),
+    datetime3: new Date( Date.parse('2015-01-11T12:40:00Z') ),
+    date1:     '2015-01-11',
+    date3:     '2015-01-11',
   }
-  new App.ControllerForm({
+  var form = new App.ControllerForm({
     el:        el,
     model:     {
       configure_attributes: [
@@ -345,6 +365,14 @@ test( "form dependend fields check", function() {
         { name: 'select2', display: 'Select2', tag: 'select', null: true, options: { true: 'internal', false: 'public' }, default: true },
         { name: 'selectmulti2', display: 'SelectMulti2', tag: 'select', null: false, multiple: true, options: { true: 'internal', false: 'public' }, default: [] },
         { name: 'selectmultioption1', display: 'SelectMultiOption1', tag: 'select', null: true, multiple: true, options: [{ value: true, name: 'internal' }, { value: false, name: 'public' }], default: true },
+        { name: 'datetime1', display: 'Datetime1', tag: 'datetime', null: true, default: defaults['datetime1']  },
+        { name: 'datetime2', display: 'Datetime2', tag: 'datetime', null: true, default: defaults['datetime2']  },
+        { name: 'datetime3', display: 'Datetime3', tag: 'datetime', null: false, default: defaults['datetime3']  },
+        { name: 'datetime4', display: 'Datetime4', tag: 'datetime', null: false, default: defaults['datetime4']  },
+        { name: 'date1',     display: 'Date1',     tag: 'date', null: true, default: defaults['date1']  },
+        { name: 'date2',     display: 'Date2',     tag: 'date', null: true, default: defaults['date2']  },
+        { name: 'date3',     display: 'Date3',     tag: 'date', null: false, default: defaults['date3']  },
+        { name: 'date4',     display: 'Date4',     tag: 'date', null: false, default: defaults['date4']  },
       ],
     },
     params: defaults,
@@ -359,6 +387,16 @@ test( "form dependend fields check", function() {
           action: 'hide'
         },
       },
+      {
+        bind: {
+          name: 'select1',
+          value: ["true"]
+        },
+        change: {
+          name: 'datetime1',
+          action: 'hide'
+        },
+      },
       {
         bind: {
           name: 'select1',
@@ -369,6 +407,16 @@ test( "form dependend fields check", function() {
           action: 'show'
         },
       },
+      {
+        bind: {
+          name: 'select1',
+          value: ["false"]
+        },
+        change: {
+          name: 'datetime1',
+          action: 'show'
+        },
+      },
       {
         bind: {
           name: 'select1',
@@ -422,9 +470,26 @@ test( "form dependend fields check", function() {
     select1: "false",
     select2: "false",
     selectmulti2: [ "true", "false" ],
-    selectmultioption1: "false"
+    selectmultioption1: "false",
+    datetime1: '2015-01-11T12:40:00.000Z',
+    datetime2: undefined,
+    datetime3: '2015-01-11T12:40:00.000Z',
+    datetime4: undefined,
+    date1: '2015-01-11',
+    date2: undefined,
+    date3: '2015-01-11',
+    date4: undefined,
   }
   deepEqual( params, test_params, 'form param check' );
+
+  errors = form.validate(params)
+  test_errors = {
+    datetime4: "is required",
+    date4:     "is required",
+  }
+  deepEqual( errors, test_errors, 'validation errors check' )
+  App.ControllerForm.validate( { errors: errors, form: el } )
+
   el.find('[name="select1"]').val('true')
   el.find('[name="select1"]').trigger('change')
   params = App.ControllerForm.params( el )
@@ -435,7 +500,15 @@ test( "form dependend fields check", function() {
     select1: "true",
     select2: "false",
     selectmulti2: [ "true", "false" ],
-    selectmultioption1: "false"
+    selectmultioption1: "false",
+    datetime1: undefined,
+    datetime2: undefined,
+    datetime3: '2015-01-11T12:40:00.000Z',
+    datetime4: undefined,
+    date1: '2015-01-11',
+    date2: undefined,
+    date3: '2015-01-11',
+    date4: undefined,
   }
   deepEqual( params, test_params, 'form param check' );
 });