Convert a Wiki form to HTML for View/Edit

(Still on TWiki, moving to Foswiki r.s.n.)

Assume I have a wiki application with forms.

I can initialize a new topic and its form values using an HTML form, sending data to the new topic to fill in the wiki form fields.

Can I later convert that wiki form back into HTML for viewing and possible editing of the values?

Use case: app developer wants more control over the look and feel of the form when updating. E.g. put several fields on one line, add more text for instructions, etc. Wiki forms are a bit sparse in terms of "help" text and tend to be one field above the other in a long vertical column.

I can easily imagine how to handle a text or textarea field.

input type="text" value="%FORMFIELD{"Field1" topic="FooFraz"}%" ... />

but I'm stumped for how to handle a menu or checkboxes.

Does anyone have examples?

Is this even possoble for more than just text fields?

---

Foswiki's form rendering code doesn't have a macro that wiki-app users can take advantage of, so traditionally you had to reverse-engineer checkbox/select controls yourself.

A less depressing option is FlexFormPlugin, which exposes the rendering code as two macros: RENDERFOREDIT and RENDERFORDISPLAY. It will automatically render any formfield by name, for view or edit, based on its DataForms definition.

So, on Foswiki 1.1 (and 1.0 with AutoViewTemplatePlugin) the usual basic wiki app pattern (for me at least) looks like this:

• Dashboard topic, with a new-topic-creator set up something like this:

  <form method="post" action="%SCRIPTURLPATH{"edit"}%/%WEB%/PersonAUTOINC0">
     %RENDERFOREDIT{form="PersonForm"}%
     <input type="hidden" name="redirectto" value="%BASEWEB%.%BASETOPIC%"/>
     <input type="submit"/>
   </form>

  and usually JQGridPlugin for an easy-to-search/sort/find/edit grid view on the topic set
  • A PersonForm defining the Person topic
  • A PersonViewTemplate controlling the look of the topic when you view it
    • Depending on whether I'm using custom DataForms types, I use

      *Address:* %RENDERFORDISPLAY{topic="%TOPIC%" fields="Address"}%

      or if it's just a boring (plaintext) field type I'll use something like

      *Name:* %QUERY{"LastName"}%, %QUERY{"FirstName"}%

Check out Foswiki 1.1's System.FrequentlyAskedQuestions for how to put together a custom view template (although it doesn't use FlexFormPlugin, so manually crafts the HTML).

If you want a custom topic-creator element embedded on some other page, I think you'll have to use RENDERFOREDIT to display each field separately inside a custom <form...... but if you just want a custom layout while editing those topics themselves, just re-use the ViewTemplate approach and make an EditTemplate as well (the System.FrequentlyAskedQuestions demo has an example of this). The strategy I use at work is to actually have each formfield as a topic of the same name that has itself got a form attached to it, with a "Description" field. Then we can build more interesting views... have I given you some ideas to work from? Let me know if I haven't.

-- PaulHarvey - 07 Mar 2011