# Introducing markdown extensions for form input

**URL:** <https://talk.commonmark.org/t/introducing-markdown-extensions-for-form-input/432>\
**Category:** Extensions\
**Created:** [September 5, 2014, 8:33pm UTC](https://talk.commonmark.org/t/introducing-markdown-extensions-for-form-input/432 "2014-09-05T20:33:13Z")\
**Posts on this page:** 1\
**Showing post:** 2

<div class="post-metadata">

**Author:** ![mofosyne](https://talk.commonmark.org/user_avatar/talk.commonmark.org/mofosyne/32/1438_2.png) [@mofosyne](https://talk.commonmark.org/u/mofosyne)\
**Post date:** [October 21, 2014, 12:25pm UTC](https://talk.commonmark.org/t/introducing-markdown-extensions-for-form-input/432/2 "2014-10-21T12:25:59Z")

</div>

## This is best done as a generic directive input

Generic Directive Style Brainstorming. The idea is that you could potentially print this as it is and fill it out if you really needed to.

A field starts with a field description of this form, which is always ended by a `:`

```
<field description. Field name autodetected in here> : 

```

After the field description, the fieldtype is indicated via examples shown below.

Each field name is either autodetected, or can be pointed via `*fieldname*` or `{fieldname}`

```
!form: Form Header Name
!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!

Choose an *email*?: ______________
Choose a *password*: *** ___________

Describe why you want to register:
[________________________________]
[________________________________]{description}

*Gender*: ["male" / "female"]

Which of these *features* will you need?:
* [X] simplicity
* [] Don't know
* [] complete

Radio Button. Which *pet* do you want most?:
* (X) cat
* ( ) dog
* ( ) bird

          [>> OK <<] [!! RESET !!]

!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
{action="MAILTO:someone@example.com" method="post" enctype="text/plain"}

```

* * *

## Designed to fail gracefully

Choose an _email_?: \_\_\_\_\_\_\_\_\_\_\_\_\_\_  
Choose a _password_: \*\*\*\_\_\_\_\_\_\_\_\_\_\_

Describe why you want to register:  
[\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_]  
\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_\_

_Gender_: [“male” / “female”]

Which of these _features_ will you need?:

- simplicity
- Don’t know
- complete

Radio Button. Which _pet_ do you want most?:

- (X) cat
- ( ) dog
- ( ) bird

[\>\> OK \<\<] [!! RESET !!]

* * *

##Other form inputs:

### Buttons

- submit button: `[>> TEXT HERE <<]`
- reset button: `[!! TEXT HERE !!]`

### Drop down list: [W3Schools Tryit Editor](http://www.w3schools.com/html/tryit.asp?filename=tryhtml_select3)

Fiat option preselected

```
Choose a *car*:
* [Volvo]
* [Saab]
* [- Fiat -]
* [Audi]

```

### Field set: [W3Schools Tryit Editor](http://www.w3schools.com/tags/tryit.asp?filename=tryhtml_fieldset)

```
# is first level fieldset
## Second level fieldset

```

e.g.

```
# Login Details
Choose a Username: ______________
Choose a password: *** ___________

# Personal Details
Gender: ["male" / "female"]
Religion: ________

```

### Datalist: [HTML datalist Tag](http://www.w3schools.com/tags/tag_datalist.asp)

```
What is your *browser*?: ______________
* Internet Explorer
* Firefox
* Chrome
* Opera
* Safari

```

* * *

Also useful to know:

[http://stackoverflow.com/questions/5759661/wiki-or-markdown-like-syntax-for-simple-forms](http://stackoverflow.com/questions/5759661/wiki-or-markdown-like-syntax-for-simple-forms)

---

_[View the full topic](https://talk.commonmark.org/t/introducing-markdown-extensions-for-form-input/432)._
