Skip to content

Forms with Markdown #59

@jmatsushita

Description

@jmatsushita

There is a CommonMark extension on the list of proposed extensions

https://talk.commonmark.org/t/introducing-markdown-extensions-for-form-input/432

I remember talking about this also with Greenhost in relation to Quizzes for TOTEM which uses EdX which also has its form like markdown syntax:

http://edx.readthedocs.io/projects/edx-partner-course-staff/en/latest/exercises_tools/multiple_choice.html#example-multiple-choice-problem

There are a number of modules in NodeJS:

Comparison of syntaxes

Proposed Extension

!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:[email protected]" method="post" enctype="text/plain"}

EdX Quizzes

>>What Apple device competed with the portable CD player?<<
    (!) The iPad
    ( ) Napster
    (x) The iPod
    ( ) The vegetable peeler {{Label:: Feedback for learners who select this answer.}}
    (@) All of the above

SlamDown

name = ____
interests = ________ (SlamData)
year = #________  (1999)
commute = () car (x) bus () bike
phones = [x] iPhone [] Blackberry [x] Android
city = {BOS, SFO, NYC}

date = ____-__-__ (2016-04-19)
time = __:__ (02:30 PM)

start = ____-__-__ __:__ (2016-04-19 14:00)

Markdown Forms

https://github.com/rbnvrw/markdown-forms

?{type}("label" "value" "placeholder" rows*cols){.class}
<form role="form" markdown="1">
  ?{text}("Name" "" "Name..."){.form-control}
  ?{email}("Email" "" "Email..."){.form-control}
  ?{text}("Subject" "" "Subject..."){.form-control}
  ?{textarea}("Message" "" "Message..." 3*20){.form-control}
  ?{submit}("" "Send!"){.form-control}
</form>

Marked Forms

marked-form uses a variation on link syntax:

[Provide a Name ??]()
[Choose one ?select?](nme)
- option1
- option2
- option3
[?checklist?](name)
- check1
- check2
- check3
[Radiolist with a label before ?radiolist?](name)'
- radio1
- radio2
- radio3
[Submit text ?submit?]()

Formdown

Formdown is for Rails:

Hi _________(Name)

How are you doing today? () Good () Ok () Bad

Could I have your email address? __________@(Email)

Write a few lines that describe your mood: ____________///(Mood)

[ Submit your feelings ]

WMD Fork

There is a fork of the WMD editor which uses a syntax which seems to have directly inspired Slamdown. It also has

User friendly labels

city = {BOS -> Boston, SFO -> San Francisco, (NYC -> New York City)}

And Required fields

zip code* = ___[50]

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions