diff --git a/addons/web/static/src/css/base.css b/addons/web/static/src/css/base.css
index 4645c55f692..f6d20e2b617 100644
--- a/addons/web/static/src/css/base.css
+++ b/addons/web/static/src/css/base.css
@@ -892,7 +892,10 @@ label.error {
     position: absolute;
     cursor: pointer;
     right: 5px;
-    top: 5px;
+    top: 3px;
+}
+.openerp .oe_datepicker {
+    position: relative;
 }
 .openerp .oe_input_icon_disabled {
     position: absolute;
diff --git a/addons/web/static/src/js/search.js b/addons/web/static/src/js/search.js
index 14987fab289..a26d87636d8 100644
--- a/addons/web/static/src/js/search.js
+++ b/addons/web/static/src/js/search.js
@@ -793,20 +793,21 @@ openerp.web.search.BooleanField = openerp.web.search.SelectionField.extend(/** @
  * @extends openerp.web.search.DateField
  */
 openerp.web.search.DateField = openerp.web.search.Field.extend(/** @lends openerp.web.search.DateField# */{
-    /**
-     * enables date picker on the HTML widgets
-     */
+    template: "SearchView.date",
     start: function () {
         this._super();
-        this.$element.addClass('field_date').datepicker({
-            dateFormat: 'yy-mm-dd'
-        });
+        this.datewidget = new openerp.web.DateWidget(this);
+        this.datewidget.prependTo(this.$element);
+        this.datewidget.$element.find("input").attr("size", 15);
+        this.datewidget.$element.find("input").attr("autofocus",
+            this.attrs.default_focus === '1' ? 'autofocus' : undefined);
+        this.datewidget.set_value(this.defaults[this.attrs.name] || false);
     },
     stop: function () {
         this.$element.datepicker('destroy');
     },
     get_value: function () {
-        return this.$element.val();
+        return this.datewidget.get_value() || null;
     }
 });
 /**
diff --git a/addons/web/static/src/js/view_form.js b/addons/web/static/src/js/view_form.js
index e2a83679da7..6d224a46109 100644
--- a/addons/web/static/src/js/view_form.js
+++ b/addons/web/static/src/js/view_form.js
@@ -1145,6 +1145,7 @@ openerp.web.DateTimeWidget = openerp.web.Widget.extend({
         this.$element.find('button.oe_datepicker_close').click(function() {
             self.$element.find('.oe_datepicker').hide();
         });
+        this.set_readonly(false);
     },
     picker: function() {
         return $.fn[this.jqueryui_object].apply(this.$element.find('.oe_datepicker_container'), arguments);
diff --git a/addons/web/static/src/xml/base.xml b/addons/web/static/src/xml/base.xml
index d2b2f618eec..afec46fe6ad 100644
--- a/addons/web/static/src/xml/base.xml
+++ b/addons/web/static/src/xml/base.xml
@@ -801,8 +801,7 @@
     <img class="oe_field_translate" t-if="widget.field.translate" src="/web/static/src/img/icons/terp-translate.png" width="16" height="16" border="0"/>
 </t>
 <t t-name="web.datetimepicker">
-       <!-- t-att-class="'field_' + widget.type"-->
-    <div>
+    <div class="oe_datepicker">
         <input type="text" size="1" style="width: 100%"/>
         <img class="oe_input_icon oe_datepicker_trigger" src="/web/static/src/img/ui/field_calendar.png"
              title="Select date" width="16" height="16" border="0"/>
@@ -1054,6 +1053,18 @@
         <t t-if="filters.length" t-raw="filters.render(defaults)"/>
     </div>
 </t>
+<t t-name="SearchView.date">
+    <label t-att-class="'oe_label' + (attrs.help ? '_help' : '')"
+           t-att-title="attrs.help"
+           t-att-for="element_id">
+        <t t-esc="attrs.string || attrs.name"/>
+        <span t-if="attrs.help">?</span>
+    </label>
+    <div style="white-space: nowrap;">
+        <span t-att-id="element_id"></span>
+        <t t-if="filters.length" t-raw="filters.render(defaults)"/>
+    </div>
+</t>
 <t t-name="SearchView.field.selection">
     <label t-att-title="attrs.help"
            t-att-class="'oe_label' + (attrs.help ? '_help' : '')"