diff --git a/web_widget_timepicker/README.rst b/web_widget_timepicker/README.rst
index 3f6bf12c..fa64c2df 100644
--- a/web_widget_timepicker/README.rst
+++ b/web_widget_timepicker/README.rst
@@ -30,7 +30,7 @@ Set the attribute ``widget=timepicker`` in a ``field`` tag in a form view.
 You can pass all options through the "timepicker" field in the options::
 
     ...
-    <field name="mytimefieldname" `widget=timepicker`` options="{'step': '15', 'disableTextInput': false}"/>
+    <field name="mytimefieldname" `widget=timepicker`` data-options="{'step': '30', 'disableTextInput': false}"/>
     ...
 
 See the available options at https://github.com/jonthornton/jquery-timepicker#timepicker-plugin-for-jquery
diff --git a/web_widget_timepicker/__init__.py b/web_widget_timepicker/__init__.py
index ea2c0d3a..2977e4d6 100644
--- a/web_widget_timepicker/__init__.py
+++ b/web_widget_timepicker/__init__.py
@@ -1,2 +1,2 @@
 # -*- coding: utf-8 -*-
-# License AGPL-3.0 or later (http://www.gnu.org/licenses/agpl).
\ No newline at end of file
+# License AGPL-3.0 or later (http://www.gnu.org/licenses/agpl).
diff --git a/web_widget_timepicker/static/src/js/web_widget_timepicker.js b/web_widget_timepicker/static/src/js/web_widget_timepicker.js
index 948e9f9f..edae97d8 100644
--- a/web_widget_timepicker/static/src/js/web_widget_timepicker.js
+++ b/web_widget_timepicker/static/src/js/web_widget_timepicker.js
@@ -5,6 +5,15 @@ odoo.define('web_widget_timepicker.form_widgets', function (require) {
     var formats = require('web.formats');
     var common = require('web.form_common');    
 
+    // Snippet from http://stackoverflow.com/questions/9036429/convert-object-string-to-json
+    function cleanup_str2json(str) {
+      return (str.length > 0 && str !== undefined) ? str
+        // wrap keys without quote with valid double quote
+        .replace(/([\$\w]+)\s*:/g, function(_, $1){return '"'+$1+'":'})    
+        // replacing single quote wrapped ones to double quote 
+        .replace(/'([^']+)'/g, function(_, $1){return '"'+$1+'"'}) : undefined;         
+    };
+
     var TimePicker = common.AbstractField.extend(common.ReinitializeFieldMixin, {
         is_field_number: true,        
         template: "TimePickerField",
@@ -29,39 +38,24 @@ odoo.define('web_widget_timepicker.form_widgets', function (require) {
         },
         initialize_content: function() {
             if(!this.get("effective_readonly")) {
-                this.$input = this.$el.find('input');
-
-                var effective_options = this.options;
+                var custom_options;
 
-                if(typeof this.node.attrs.options !== 'undefined' && this.node.attrs.options.length > 0 ) {
+                if( this.node.attrs['data-options'] !== undefined && this.node.attrs['data-options'].length > 0) {
+                    // First try to use jquery data function to create object
+                    custom_options = $(this.node).data('options');
 
-                    var custom_options = eval('('+ this.node.attrs.options +')');
-
-                    // for(var key in custom_options) {
-                    //     console.log('attr key : ' + key);
-                    //     console.log('attr value : ' + custom_options[key] );
-                    // }
-
-                    // if(typeof effective_options === 'object') {
-                    //     for(var key in effective_options) {
-                    //         console.log('def key : ' + key);
-                    //         console.log('def value : ' + effective_options[key] );
-                    //     }
-                    // }
-                    
-                    if(typeof custom_options === 'object') {
-                        effective_options = $.extend({}, this.options, custom_options ); 
+                    if(typeof custom_options !== 'object') {
+                        // No garantee that the input data-options string is valid JSON format so try to cleanup
+                        custom_options = JSON.parse(cleanup_str2json(this.node.attrs['data-options']));    
                     }
+                }
 
-                    // if(typeof effective_options === 'object') {
-                    //     for(var key in effective_options) {
-                    //         console.log('merge key : ' + key);
-                    //         console.log('merge value : ' + effective_options[key] );
-                    //     }
-                    // }
+                if(typeof custom_options === 'object') {
+                    this.$el.find('input').timepicker($.extend({}, this.options, custom_options )); 
+                } else {
+                    this.$el.find('input').timepicker(this.options);                    
                 }
 
-                this.$input.timepicker(effective_options); 
                 this.setupFocus(this.$('input'));                   
             }   
         },