Respond to a double click in the ejRTE control

I have a read-only version of the ejRTE and I would like to be to put it in a edit mode by double-clicking in the RTE. Is that possible? Any suggestions?

3 Replies

PO Prince Oliver Syncfusion Team February 28, 2018 10:30 AM UTC

Hi Brian, 

Thank you for contacting Syncfusion support. 

Yes, it is possible. We need to bind double click event handler for the RTE’s Iframe and using that event we need to trigger any event in the parent window, where we need to set the allowEditing property in RTE to true. Kindly refer to the following code. 

<div style="padding:10px"> 
  <textarea id="rte"> This is test content </textarea> 
</div> 
<script> 
  var rteObj; 
  $(function(){ 
    $("#rte").ejRTE({ allowEditing: false, create:"oncreate" }); 
    $(document).on("dblclick", function(e) { 
      rteObj.setModel({ allowEditing: true}); 
      }); 
     
  }); 
  function oncreate() { 
    rteObj = this; 
    var $head = this._rteIframe.contents().find("head"); 
    var script = "<script> document.addEventListener('dblclick', function(e){ parent.$(parent.document).trigger('dblclick'); }); <\/script>"; 
    $head.append(script); 
  } 
</script> 
   
We have prepared a sample for your reference, refer to the following playground link: http://jsplayground.syncfusion.com/21fpxe3m  

Regards, 
Prince 



BR Brian February 28, 2018 04:27 PM UTC

Thank you! 


PO Prince Oliver Syncfusion Team March 1, 2018 04:21 AM UTC

Hi Brian, 

Most Welcome. We are glad to help you. 

Regards, 
Prince 


Loader.
Up arrow icon