Textbox.io supports several mechanisms of setting and getting content. This article outlines a number of common methods for working with HTML content using Textbox.io.
Note that both programmatic (JavaScript) and automatic (HTML + POST) methods for working with content are available.
Setting Content with Javascript
A developer can explicitly set the content of an editor, rather than rely on the automatic behavior of replace. To set the HTML contents of an editor, simply pass a string of HTML content to editor.content.set().
Setting Content Automatically with replace()
When adding a Textbox.io editor to a page using replace, the HTML content for any matched element is passed to the newly created editor instance. In this way Textbox.io can be used to edit the HTML contents of any specified <textarea> or <div> without the need for a specific setting of the editor's content - the editor simply reads in the contents of the matched element.
Getting Content with Javascript
To get the content of an editor explicitly, a developer can use editor.content.get(). This method returns a string representation of the editor's HTML content.
Getting Content Automatically with HTML <form> POST
When Textbox.io is used to replace a <textarea> element within a <form>, Textbox.io will mimic the behavior of the original <textarea> when the form is submitted. This means that the contents of the editor are simply posted along with the other form elements, using the name attribute of the original <textarea> as the key.
Image Content
By default Textbox.io saves local images as Base64 data URIs. This encodes images directly within the HTML of the content rather than separate files. This enable images to be imported from Microsoft Word and images to be available in the document immediately without uploading.
See Handling Local Images for information on uploading local image content to your application.