react-native-zss-rich-text-editor icon indicating copy to clipboard operation
react-native-zss-rich-text-editor copied to clipboard

How to disable touch?

Open Juxtlie opened this issue 8 years ago • 3 comments

Hello.Sometimes I need to disable focus on the textinpunt . How to make it? Best Regards

Juxtlie avatar Apr 20 '17 11:04 Juxtlie

Have you tried placing a touchable view over the editor?

Shujito avatar Jul 14 '17 16:07 Shujito

You can add your own methods in editor.html to support disabling/enabling editing:

			zss_editor.disableContentEditing = function(html) {
				$('#zss_editor_content').attr('contenteditable','false');
			}

			zss_editor.enableContentEditing = function(html) {
				$('#zss_editor_content').attr('contenteditable','true');
			}

Then in 'const.js':

  disableContentEditing: 'DISABLE_CONTENT_EDITING',
  enableContentEditing: 'ENABLE_CONTENT_EDITING',

Add the following to your WebviewMessageHandler.js:

        case '${actions.disableContentEditing}':
          zss_editor.disableContentEditing();
          break;
        case '${actions.enableContentEditing}':
          zss_editor.enableContentEditing();
          break;

Finally, add the methods in your 'RichTextEditor.js':

  disableContentEditing() {
    this._sendAction(actions.disableContentEditing);
  }

  enableContentEditing() {
    this._sendAction(actions.enableContentEditing);
  }

You can just call disableContentEditing and enableContentEditing to disable and re-enable touch

ethanyuwang avatar Jun 06 '18 17:06 ethanyuwang

Can confirm this works. @ethanyuwang Thank you.

I modified the functions slightly for my particular use case so that title editing is controlled too, e.g.

      zss_editor.disableContentEditing = function(html) {
				$('#zss_editor_content').attr('contenteditable','false');
        $('#zss_editor_title').attr('contenteditable','false');
			}

			zss_editor.enableContentEditing = function(html) {
				$('#zss_editor_content').attr('contenteditable','true');
        $('#zss_editor_title').attr('contenteditable','true');
			}

mattslight avatar Nov 18 '18 06:11 mattslight