(8 intermediate revisions by 2 users not shown)
Line 2: Line 2:
 
textarea
 
textarea
 
===Type===
 
===Type===
_input
+
textarea
 
===Synopsis===
 
===Synopsis===
 
How to render a textarea input field  
 
How to render a textarea input field  
 
===Description===
 
===Description===
_input elements of type="textarea" create larger text input fields that let the user enter a text.
+
textarea elements create larger text input fields that let the user enter a text.
This differs from original HTML5 as textarea is not part of an input field, but an input type on its own.
+
It also differs from other input fields as there is no value you can set. Instead you use an opening input type and a closing one. The value will be in between. See example.
It also differs from other _input fields as there is no value you can set. Instead you use an opening _input type and a closing one. The value will be in between. See example.
 
 
===Parameters===
 
===Parameters===
type="textarea"
+
<code><nowiki><textarea></textarea></nowiki></code>
  
For all supported argument have a look at the link at the links section.
+
There is one non-HTML5 argument you can use together with a textarea and it is called '''source'''. When you add the argument source="<FULLPAGENAME>" to a textarea, FlexForm will grab the main content of that page and put it inside the textarea. '''Example : source="Main page"''', will put the main content of the main page inside the textarea. If you have e.g. the extension Visual editor for all or the Tinymce extension, this feature will allow to easily edit a different page right in the form you are creating.
 +
 
 +
For all supported HTML5 arguments have a look at the link at the links section.
 
===Example===
 
===Example===
 
<syntaxhighlight lang="html">
 
<syntaxhighlight lang="html">
<_input type="textarea" name="comment" placeholder="Type your comment" required="required">This is the text value</_input>
+
<textarea name="comment" placeholder="Type your comment" required="required">This is the text value</textarea>
 
</syntaxhighlight>
 
</syntaxhighlight>
<_input type="textarea" name="comment" placeholder="Type your comment" required="required">This is the text value</_input>
+
<textarea name="comment" placeholder="Type your comment" required="required">This is the text value</textarea>
===Note===
+
 
 +
===Notes===
 +
====VisualEditor====
 +
If you have installed the [[mw:Extension:VisualEditor|VisualEditor]] and [[mw:Extension:VEForAll|VEForAll]] extensions, you can associate a textarea with the VisualEditor interface for rich text editing. To do so, just add <code>editor="ve"</code> to your textarea. You can have as many VE editors on a page as needed.
 +
 
 +
====Version note====
 +
In earlier versions of FlexForm, you would use an <code>_input</code> with <code>type="textarea"</code>.
 +
 
 
===Links===
 
===Links===
 
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea
 
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea
ws-class-props
Line 1: Line 1:
 
{{Doc properties
 
{{Doc properties
|Subject version=2.0
+
|Subject version=2.0,2.1
 
|Doc subject=DevOps:Doc/FlexForm
 
|Doc subject=DevOps:Doc/FlexForm
 
|Doc parent=DevOps:Doc/FlexForm/1.0/input
 
|Doc parent=DevOps:Doc/FlexForm/1.0/input

Latest revision as of 16:43, 5 December 2023

Name

textarea

Type

textarea

Synopsis

How to render a textarea input field

Description

textarea elements create larger text input fields that let the user enter a text. It also differs from other input fields as there is no value you can set. Instead you use an opening input type and a closing one. The value will be in between. See example.

Parameters

<textarea></textarea>

There is one non-HTML5 argument you can use together with a textarea and it is called source. When you add the argument source="<FULLPAGENAME>" to a textarea, FlexForm will grab the main content of that page and put it inside the textarea. Example : source="Main page", will put the main content of the main page inside the textarea. If you have e.g. the extension Visual editor for all or the Tinymce extension, this feature will allow to easily edit a different page right in the form you are creating.

For all supported HTML5 arguments have a look at the link at the links section.

Example

<textarea name="comment" placeholder="Type your comment" required="required">This is the text value</textarea>

Notes

VisualEditor

If you have installed the VisualEditor and VEForAll extensions, you can associate a textarea with the VisualEditor interface for rich text editing. To do so, just add editor="ve" to your textarea. You can have as many VE editors on a page as needed.

Version note

In earlier versions of FlexForm, you would use an _input with type="textarea".

Links

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea