Skip to main content Skip to footer

Insert HTML Code Into a C1Editor Control at the Position of the Cursor

Background:

You may have a use-case where you need your users to be able to, for example, click a button to insert some pre-defined snippet of HTML into the C1Editor. This article will show you how to insert HTML code into a C1Editor control at the position of the cursor when the user clicks on a button.

Steps to Complete:

  1. Add an event that you want to use to add HTML upon triggering.

  2. Inside your event, create a variable to hold the current selection in C1Editor:

    var tr = c1Editor1.CreateRange(c1Editor1.SelectionStart, c1Editor1.SelectionLength);
  3. Just below that, add text at the location of the current selection using the XmlText property:

    tr.XmlText = "<p>Hello world!</p>";

That’s it! When your event is triggered an HTML Paragraph element should be inserted at the user’s cursor.

Alec Gall