Skip to content

Examples

External Button

This example illustrates how to clear the text using a button external to the Froala WYSIWYG HTML Editor interface.


Clear

HTML

<div id="eg-external-button" class="text-small">
          <p>This example illustrates how to clear the text using a button external to the Froala WYSIWYG HTML Editor interface.</p>
        </div>
        <br/>
        <p><a href="#" id="get-text" class="r-btn text-small">Clear</a></p>

JAVASCRIPT

<script>
  $(function() {
    $('div#eg-external-button').editable({
      inlineMode: false
    })

    $('a#get-text')
      .on('mousedown', function (e) {
        if (e.which !== 1) return true;

        e.preventDefault()
        e.stopPropagation()
      })
      .on('click', function (e) {
        e.preventDefault()
        e.stopPropagation()
      })
      .on('mouseup', function (e) {
      if (e.which !== 1) return true;

      e.stopPropagation();
      e.preventDefault();

      $('div#eg-external-button').editable('setHTML', '');
    })
  });
</script>