Merge branch 'master' of https://github.com/Utzel-Butzel/react-virtua…

…l-keyboard
Utzel-Butzel · Jul 25, 2017 · 41415b8 · 41415b8
2 parents 2a19f24 + 5af27c8
commit 41415b8
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 3 deletions.
diff --git a/dist/Keyboard.js b/dist/Keyboard.js
@@ -79,7 +79,8 @@ var _class = function (_React$Component) {
             }
 
             //Add jQuery Keyboard to DOM Element
-            (0, _jquery2.default)(_reactDom2.default.findDOMNode(this.refs.keyboard)).keyboard(this.props.options);
+            // (0, _jquery2.default)(_reactDom2.default.findDOMNode(this.refs.keyboard)).keyboard(this.props.options);
+            this.addKeyBoardToDOM();
 
             // Update while typing if usePreview is false
             if (this.props.options.usePreview === false) {
@@ -89,6 +90,11 @@ var _class = function (_React$Component) {
             }
         }
     }, {
+        key: 'addKeyBoardToDOM',
+        value: function addKeyBoardToDOM() {
+            (0, _jquery2.default)(_reactDom2.default.findDOMNode(this.refs.keyboard)).keyboard(this.props.options);
+        }
+    },{
         key: 'clear',
         value: function clear() {
             this.setState({ value: '' });

diff --git a/lib/Keyboard.js b/lib/Keyboard.js
@@ -10,6 +10,7 @@ export default class extends React.Component {
         this.state = { value: "", className: 'keyboard-wrapper' };
         this.handleChange = this.handleChange.bind(this);
     }
+
     componentDidMount() {
         // Set Value to Input Element on Accept
         this.setState({ value: this.props.value });
@@ -39,8 +40,9 @@ export default class extends React.Component {
             }.bind(this);
         }
 
-        //Add jQuery Keyboard to DOM Element
-        jQuery(ReactDOM.findDOMNode(this.refs.keyboard)).keyboard(this.props.options);
+        // Add jQuery Keyboard to DOM Element
+        // jQuery(ReactDOM.findDOMNode(this.refs.keyboard)).keyboard(this.props.options);
+        this.addKeyBoardToDOM();
 
         // Update while typing if usePreview is false
         if (this.props.options.usePreview === false) {
@@ -49,6 +51,9 @@ export default class extends React.Component {
             }.bind(this));
         }
     }
+    addKeyBoardToDOM() {
+        jQuery(ReactDOM.findDOMNode(this.refs.keyboard)).keyboard(this.props.options);
+    }
     clear() {
         this.setState({ value: '' });
     }
@@ -71,6 +76,9 @@ export default class extends React.Component {
         this.setState({ value: input });
         this.props.onChange(input);
     }
+    componentWillUnmount() {
+            jQuery(ReactDOM.findDOMNode(this.refs.keyboard)).remove();
+    }
     render() {
     var { options, value, validation, onChange, ...other } = this.props;
     if (this.props.options.type == 'textarea') {