This page (revision-1) was last changed on 29-Nov-2024 16:16 by UnknownAuthor

Only authorized users are allowed to rename pages.

Only authorized users are allowed to delete pages.

Page revision history

Version Date Modified Size Author Changes ... Change note

Page References

Incoming links Outgoing links
WikiFormsExample
WikiFormsExample

Version management

Difference between version and

At line 1 added 154 lines
JSPWiki now (2.1.127+) includes the WikiFormsPlugin that allow simple html forms to be created on wiki pages. When the form is submitted the values are passed as parameters to a user defined 'handler' plugin which is invoked when the form is submitted.
This is actually a set of interrelated plugins, not just one.
!!Synopsis...
First you start with...
* [FormSet|WikiFormsExample#FormSet] - sets default form element values.
* [FormOutput|WikiFormsExample#FormOutput] - calls the designated handler and displays its output.
* [FormOpen|WikiFormsExample#FormOpen] - starts the form by emitting the html <form> tag.
Then you put any normal wikitext between the ~FormOpen and ~FormClose along with any number of the following form elements.
* [FormInput|WikiFormsExample#FormInput] - textbox, radio buttons, check boxes, submit button
* [FormSelect|WikiFormsExample#FormSelect] - dropdown selection box
* [FormTextarea|WikiFormsExample#FormTextarea] - multiline textarea
Finally you must end your form with...
* [FormClose|WikiFormsExample#FormClose] - ends the form by emitting the html </form> tag.
And that's it, if you want you can define any number of forms on one page, just don't nest their ~FormOpen/~FormClose portions. When a form submit button is hit by the user the input/select/textarea elements are sent to the server where the handler gets invoked and the values are available as it's parameters.----
The following example uses the form plugins to provide parameters to the CurrentTimePlugin, and displays the result.!!~FormSet
The ~FormSet plugin sets the default date format for a form field ''format'' in form ''testform''. This is hidden in normal WikiPage viewing, looks like this:
{{{
[{FormSet form='testForm' format='EEE, d MMM yyyy mm:ss:HH Z'}]
}}}
[{FormSet form='testForm' format='EEE, d MMM yyyy mm:ss:HH Z'}]
!!~FormOutput
~FormOutput specifies that the 'handler' (here, the ''CurrentTimePlugin''), should be used to generate some output to display here. While the output is __usually__ built in response to a POST from a form called ''testform'', the ''populate'' attribute here hints that we want default information shown (the plugin called) even if no post has yet been made.
{{{
[{FormOutput form='testForm' handler='CurrentTimePlugin' populate='handler'}]
}}}
[{FormOutput form='testForm' handler='CurrentTimePlugin' populate='handler'}]!!~FormOpen
The third element starts the actual HTML form called ''testform'', there is no visible output from this.
{{{
[{FormOpen form='testform'}]
}}}
[{FormOpen form='testform'}]!!~FormInput
!Text fields
We'll use a text field to provide the format of CurrentTimePlugin's output. Notice that the name of this field is ''format'' - the name of CurrentTimePlugin's relevant parameter. This value is passed straight to CurrentTimePlugin on submit:
{{{
[{FormInput type='text' name='format'}]
}}}
Enter the time format string: [{FormInput type='text' name='format'}]
The rest of this form merely demonstrates the other HTML form elements. They don't mean anything to the CurrentTimePlugin of course, but just for fun here's what they look like.
!Checkboxes
{{{
[{FormInput type='checkbox' name='orderSpam' value='spam'}] Spam!\\
[{FormInput type='checkbox' name='orderParrot' value='parrot'}] Dead parrot.\\
[{FormInput type='checkbox' name='orderLumber' value='lumber'}] Lumberjack.\\
}}}
[{FormInput type='checkbox' name='orderSpam' value='spam'}] Spam!\\
[{FormInput type='checkbox' name='orderParrot' value='parrot'}] Dead parrot.\\
[{FormInput type='checkbox' name='orderLumber' value='lumber'}] Lumberjack.\\!Radio buttons
Notice that all radio button elements share the same name, that's how you can 'group' them if you want multiple sets.
You can set the default checked item using {{checked='on|true|yes'}}. (In versions past 2.2.33 the value may also include the XHTML value of 'checked'.)
{{{
[{FormInput type='radio' name='favoriteActor' value='jones'}] Terry Jones
[{FormInput type='radio' name='favoriteActor' value='chapman' checked='true'}] Graham Chapman
[{FormInput type='radio' name='favoriteActor' value='cleese'}] John Cleese
[{FormInput type='radio' name='favoriteActor' value='idle'}] Eric Idle
[{FormInput type='radio' name='favoriteActor' value='gilliam'}] Terry Gilliam
[{FormInput type='radio' name='favoriteActor' value='palin'}] Michael Palin
}}}
[{FormInput type='radio' name='favoriteActor' value='jones'}] Terry Jones\\
[{FormInput type='radio' name='favoriteActor' value='chapman' checked='true'}] Graham Chapman\\
[{FormInput type='radio' name='favoriteActor' value='cleese'}] John Cleese\\
[{FormInput type='radio' name='favoriteActor' value='idle'}] Eric Idle\\
[{FormInput type='radio' name='favoriteActor' value='gilliam'}] Terry Gilliam\\
[{FormInput type='radio' name='favoriteActor' value='palin'}] Michael Palin!Submit buttons
What good is a form if there isn't any way to submit it? You can of course put multiple submit buttons, each for differing actions the ''name'' parameter will be a key in the parameter Map passed to the plugin. The plugin can look for various keys to tell which button was used to do the form submission.
{{{
[{FormInput type='submit' name='updateButton' value='Update Button'}]
[{FormInput type='submit' name='differentButton' value='A Different Button'}]
}}}
[{FormInput type='submit' name='updateButton' value='Update Button'}]
[{FormInput type='submit' name='differentButton' value='A Different Button'}]
!!~FormSelect
This allows you to define a drop-down selection list. Notice, the asterisk; this denotes the default value to be selected when displayed. The separator character (;) and the default character (*) can be overridden - check the JavaDocs of this plugin.
{{{
[{FormSelect name='breakfast' value='egg and spam;egg bacon and spam;*egg bacon sausage
and spam;spam bacon sausage and spam;spam egg spam spam bacon and spam;'}]
}}}
[{FormSelect name='breakfast' value='egg and spam;egg bacon and spam;*egg bacon sausage and spam;spam bacon sausage and spam;spam egg spam spam bacon and spam;'}]\\!!~FormTextareas...
Of course what good is a form without the abiltiy to have a multiline text area.
Please tell us why you like [Monty Python|http://en.wikipedia.org/wiki/Monty_Python]
{{{
[{FormTextarea name='whyIlikeMontyPython' rows=5 cols=40}]
}}}
[{FormTextarea name='whyIlikeMontyPython' rows=5 cols=40}]!!~FormClose
And, finally, an invisible closing element to denote that this form has ended:
{{{
[{FormClose}]
}}}
[{FormClose}]
----
!!What happens on submit?
When you click on a submit button, the form is posted to the current page. All the Form inputs specified on the page are given to the WikiPlugin defined in the ''FormOpen'' invocation's ''handler'' parameter. The plugin receives the inputs in a Map of input name-value pairs (just like WikiPlugins always do), performs whatever logic it needs to do, and optionally provides output (see FormOutput). It may also adjust the submitted values.
The form is then redisplayed, with the submitted values (except where adjusted by the handler).
----
Hope this helps. These plugins are availble as part of the 2.1.127+ version of JSPWiki. Enjoy your spam.
----
Can I set a value in handler for a input box and display it on the next page? -- GerryLau\\
I found the answer. Need to pay attention to the order of FormOutput and FormSet. Otherwise your value set in FormOutput will be overwritten by the coming FormSet.----
Hi,
I wrote a plugin which processes a form. The problem that i would like to display the result on a new page coming up immediately after submit.
I see some solution that saves a new page and gives back a link to the newly created page. But I don't want to store pages, but dynamically generate them.
Any idea?
Gergo
--GergelyGulis, 28-Oct-2006
Hi,
Could I get the form to pass the input values to a external server, some where else on the web, or will it only send data to a local plugin?
Barry Beveridge, 11-Jan-2007
----
Barry, HTML forms have an {{action}} attribute that contain any valid URL, but we don't really want people to have the freedom to be returning the content of processed forms to anywhere on the net from a user-edited page simply for security reasons, e.g., someone might fill out a form with private information thinking it's going one place but it's really getting sent somewhere else. Now, if you're a wiki site administrator and want form content sent somewhere else, you can write a plugin handler to receive the form content, then have that handler do the dirty work. This keeps the security intact and allows you to process the output in whatever way you like (and also maintain security in whatever way you like since the handler is within your control).
For example, I've been playing with XML-RPC recently, and it's feasible to have the form handler plugin send its content via XML-RPC to another wiki site, or any other that could receive the XML-RPC transmission. This of course is just one possible approach (with other "web services" possible too), but the way to do this is with your own custom handler.
-- MurrayAltheim, 12-Jan-2007
----
I don't understand how the form is processed. I want to create some kind of issuetracker, kind of like the NewIdea tracker. I've adjusted the FormOutput example, but I get the message "Cannot instantiate plugin FormHandler". I'm using version 2.5.18.
# When submitting a form, does this mean that automatically a page is created?
# How can I specify the name of the page from field names?
# What kind of handlers are there, which one should I use?
# In the bugreport form I see the bugreporthandler, and another parameter populate='handler'. Is this populate parameter specific to this handler? What other parametes are there?
# I want to create a link to the issuetracker in the new page automatically. I suppose I can do this using a form element value.
# Is it possible to use hidden elements?--RvW, 08-Feb-2007----
I would like to get a complete list and explanation of ALL the syntax that the Wiki Forms Plugin uses. Can anyone help me?
--[Bill Robfogel|mailto:wrobfogel@earthlink.net], 06-Apr-2007
This page (revision-1) was last changed on 29-Nov-2024 16:16 by UnknownAuthorTop