Theme
arya
luna-amber
luna-blue
luna-green
luna-pink
nova-dark
nova-light
saga
vela
MarkdownEditor
Markdown Editor

A text area replacement for writing beautiful and understandable Markdown. EasyMDE allows users who may be less experienced with Markdown to use familiar toolbar buttons and shortcuts. In addition, the syntax is rendered while editing to clearly show the expected result. Headings are larger, emphasized words are italicized, links are underlined, etc. EasyMDE also features both built-in auto saving and spell checking. The editor is entirely customizable, from theming to toolbar buttons and javascript hooks.

Based on Easy MDE by Sparksuite, Inc, Jeroen Akkerman.

Components and more
Documentation pe:markdownEditor
Attributes (move mouse over the names to see data types)
Name Description
id Unique identifier of the component in a namingContainer.
rendered Boolean value to specify the rendering of the component, when set to false component will not be rendered.
binding An el expression referring to a server side UIComponent instance in a backing bean.
value Value of the component.
converter An el expression or a literal text that defines a converter for the component. When it's an EL expression, it's resolved to a converter instance. In case it's a static text, it must refer to a converter id.
immediate When set true, process validations logic is executed at apply request values phase for this component. Default is false.
required Marks component as required.
validator A method expression referring to a method validating the input.
valueChangeListener A method binding expression referring to a method for handling a valuchangeevent.
requiredMessage Message to display when required field validation fails.
converterMessage Message to display when conversion fails.
validatorMessage Message to display when validation fails.
accesskey Access key to transfer focus to the input element.
cols Specifies the visible width of input element.
dir Direction indication for text that does not inherit directionality.
disabled Disables the input element, default is false.
label A localized user presentable name.
lang Code describing the language used in the generated markup.
onblur Client side callback to execute when input element loses focus.
onchange Client side callback to execute when input element loses focus and its value has been modified since gaining focus.
onclick Client side callback to execute when input element is clicked.
ondblclick Client side callback to execute when input element is double clicked.
onfocus Client side callback to execute when input element receives focus.
onkeydown Client side callback to execute when a key is pressed down over input element.
onkeypress Client side callback to execute when a key is pressed and released over input element.
onkeyup Client side callback to execute when a key is released over input element.
onmousedown Client side callback to execute when a pointer input element is pressed down over input element.
onmousemove Client side callback to execute when a pointer input element is moved within input element.
onmouseout Client side callback to execute when a pointer input element is moved away from input element.
onmouseover Client side callback to execute when a pointer input element is moved onto input element.
onmouseup Client side callback to execute when a pointer input element is released over input element.
onwheel Client side callback to execute when the mouse wheel rolls up or down over an element.
onselect Client side callback to execute when text within input element is selected by user.
oncut Client side callback to execute when the user copies the content of an element.
oncopy Client side callback to execute when the user cuts the content of an element.
onpaste Client side callback to execute when the user pastes some content in an element.
oninput Client side callback to execute when an element gets user input.
oncontextmenu Client side callback to execute when a context menu is triggered.
oninvalid Client side callback to execute when an element is invalid.
onreset Client side callback to execute when the Reset button in a form is clicked.
onsearch Client side callback to execute when the user writes something in a search field.
ondrag Client side callback to execute when an element is dragged.
ondragend Client side callback to execute at the end of a drag operation.
ondragenter Client side callback to execute when an element has been dragged to a valid drop target.
ondragleave Client side callback to execute when an element leaves a valid drop target.
ondragover Client side callback to execute when an element is being dragged over a valid drop target.
ondragstart Client side callback to execute at the start of a drag operation.
ondrop Client side callback to execute when dragged element is being dropped.
onscroll Client side callback to execute when an element's scrollbar is being scrolled.
readonly Flag indicating that this input element will prevent changes by the user.
rows Specifies the visible height of input element.
style Inline style of the input element.
styleClass Style class of the input element.
tabindex Position of the element in the tabbing order.
title Advisory tooltip information.
placeholder The placeholder attribute specifies a short hint that describes the expected value of an input field.
inputmode HTML5 inputmode attribute for hinting at the type of data this control has for touch devices to display appropriate virtual keyboard.
widgetVar Name of the client side widget.
extender Name of javascript function to extend the options of the underlying EasyMDE plugin.
minHeight Minimum Height of the editor with CSS units, set as an inline style. For example 300px or 100%/code>. Set this to the empty string in case you want to size the editor via CSS.
maxHeight Sets fixed height for the composition area. minHeight option will be ignored. Should be a string containing a valid CSS value like "500px". Defaults to undefined.
sideBySideFullscreen If set to false, allows side-by-side editing without going into fullscreen. Defaults to true.
toolbar Comma separated list of actions that defines the toolbar. If "false" it will remove the toolbar.
secure Secure the component with the HTML Sanitizer library on the classpath. Default is true.
allowFormatting Whether to allow formatting to be included when secure=true and the HTML is sanitized. Default true.
allowBlocks Whether to allow blocks to be included when secure=true and the HTML is sanitized. Default true.
allowStyles Whether to allow styles to be included when secure=true and the HTML is sanitized. Default true.
allowLinks Whether to allow links to be included when secure=true and the HTML is sanitized. Default true.
allowImages Whether to allow images to be included when secure=true and the HTML is sanitized. Default true.
allowMedia Whether to allow audio/video to be included when secure=true and the HTML is sanitized. Default true.
allowTables Whether to allow tables to be included when secure=true and the HTML is sanitized. Default true.
tabSize If set, customize the tab size. Defaults to 2.
indentWithTabs If set to false, indent using spaces instead of tabs. Defaults to true.
lineNumbers If set to true, enables line numbers in the editor. Defaults to false.
promptURLs If set to true, a JS alert window appears asking for the link or image URL. Defaults to false.
mode Mode specifies appearance of editor. Possible values are 'wysiwyg', 'preview', 'sidebyside', 'fullscreen'. Default is 'wysiwyg'.
PrimeFaces Extensions Showcase - © 2011-2023,PrimeFaces: 14.0.0,PrimeFaces Extensions: 14.0.0,JSF: Apache MyFaces JSF-2.3 Core Impl 2.3.10,Server: jetty/9.4.36.v20210114,Build time: 2024-05-01 20:50