Generate hidden input with raw value when name is passed

README.md

@@ -107,6 +107,7 @@ Parameter | Type | Default | Description
 v-model (*required*) | ISO 8601 `String` | - | Datetime.
 type | `String` | `date` | Picker type. date or datetime.
 input-class | `String` | `''` | Class for the input.
+name | `String` | `null` | Name for hidden input with raw value.
 value-zone | `String` | `UTC` | Time zone for the value.
 zone | `String` | `local` | Time zone for the picker.
 format | `String` | `DateTime.DATE_MED` or `DateTime.DATETIME_MED` | Input date format.

src/Datetime.vue

@@ -8,6 +8,7 @@
            v-on="$listeners"
            @click="open"
            @focus="open">
+    <input v-if="name" type="hidden" :name="name" :value="value">
     <transition-group name="vdatetime-fade" tag="div">
       <div key="overlay" v-if="isOpen" class="vdatetime-overlay" @click.self="cancel"></div>
       <datetime-popup
@@ -51,6 +52,9 @@ export default {
       type: String,
       default: ''
     },
+    name: {
+      type: String
+    },
     zone: {
       type: String,
       default: 'local'

test/specs/Datetime.spec.js

@@ -60,6 +60,26 @@ describe('Datetime.vue', function () {
       vm.$('.vdatetime-input').click()
       expect(vm.spy).to.have.been.calledOnce
     })
+
+    it('should not create hidden input by default', function () {
+      const vm = createVM(this,
+        `<Datetime></Datetime>`,
+        {
+          components: { Datetime }
+        })
+
+      expect(vm.$('.vdatetime input[type=hidden]')).to.not.exist
+    })
+
+    it('should create hidden input if name is passed', function () {
+      const vm = createVM(this,
+        `<Datetime name="dt"></Datetime>`,
+        {
+          components: { Datetime }
+        })
+
+      expect(vm.$('.vdatetime input[type=hidden]')).to.have.attr('name', 'dt')
+    })
   })
 
   describe('pass props', function () {
@@ -398,6 +418,76 @@ describe('Datetime.vue', function () {
     })
   })
 
+  describe('hidden input value', function () {
+    it('should be empty when value is empty', function () {
+      const vm = createVM(this,
+        `<Datetime v-model="datetime" name="dt"></Datetime>`,
+        {
+          components: { Datetime },
+          data () {
+            return {
+              datetime: ''
+            }
+          }
+        })
+
+      expect(vm.$('.vdatetime input[name=dt]').value).to.be.empty
+    })
+
+    it('should be equal to value', function () {
+      const datetime = '2017-12-31T19:34:54.078Z'
+      const vm = createVM(this,
+        `<Datetime v-model="datetime" name="dt"></Datetime>`,
+        {
+          components: { Datetime },
+          data () {
+            return { datetime }
+          }
+        })
+
+      expect(vm.$('.vdatetime input[name=dt]').value).to.equal(datetime)
+    })
+
+    it('should be equal to value even when value is not valid', function () {
+      const datetime = '2017-12-32T19:34:54.078Z'
+      const vm = createVM(this,
+        `<Datetime v-model="datetime" name="dt"></Datetime>`,
+        {
+          components: { Datetime },
+          data () {
+            return { datetime }
+          }
+        })
+
+      expect(vm.$('.vdatetime input[name=dt]').value).to.equal(datetime)
+    })
+
+    it('should be updated if value is updated', function (done) {
+      const datetime1 = '2017-12-05T00:00:00.000Z'
+      const datetime2 = '2017-12-07T00:00:00.000Z'
+      const vm = createVM(this,
+        `<Datetime v-model="datetime" name="dt"></Datetime>`,
+        {
+          components: { Datetime },
+          data () {
+            return {
+              datetime: datetime1
+            }
+          },
+          mounted () {
+            setTimeout(() => {
+              this.datetime = datetime2
+            }, 50)
+          }
+        })
+
+      setTimeout(() => {
+        expect(vm.$('.vdatetime input[type=hidden]').value).to.be.equal(datetime2)
+        done()
+      }, 50)
+    })
+  })
+
   describe('week start', function () {
     it('should be set number', function () {
       const vm = createVM(this,