Edit Table Plugin

Introduction

• Supported attributes:

  Attribute	Comment	Default
  header	Specify the header format of a new table like "|*Food*|*Drink*|". Useful to start a table with only a button	(no header)
  format	The format of one column when editing the table. A cell can be a text input field, or any of these edit field types: • Text input field (1 line):   | text, <size>, <initial value> | • Textarea input field:   | textarea, <rows>x<columns>, <initial value> | • Drop down box:   | select, <size>, <option 1>, <option 2>, etc* |   * only one item can be selected • Radio buttons:   | radio, <size*>, <option 1>, <option 2>, etc |   * size indicates the number of buttons per line in edit mode • Checkboxes:   | checkbox, <size*>, <option 1>, <option 2>, etc |   * size indicates the number of checkboxes per line in edit mode • Fixed label:   | label, 0, <label text> | • Row number:   | row, <offset> | • Date:   | date, <size>, <initial value>, <DHTML date format*> |   * see Date Field Type	"text, 16" for all cells
  changerows	Rows can be added and removed if "on" Rows can be added but not removed if "add" Rows cannot be added or removed if "off"	CHANGEROWS plugin setting
  quietsave	Quiet Save button is shown if "on", hidden if "off"	QUIETSAVE plugin setting
  include	Other topic defining the EDITTABLE parameters. The first %EDITTABLE% in the topic is used. This is useful if you have many topics with the same table format and you want to update the format in one place.	(none)
  helptopic	Topic name containing help text shown below the table when editing a table. The %STARTINCLUDE% and %STOPINCLUDE% variables can be used in the topic to specify what is shown.	(no help text)
  headerislabel	Table header cells are read-only (labels) if "on"; header cells can be edited if "off" or "0"	"on"
  editbutton	Set edit button text, e.g. "Edit this table"; set button image with alt text, e.g. "Edit table, %PUBURL%/%SYSTEMWEB%/TWikiDocGraphics/edittopic.gif"; hide edit button at the end of the table with "hide" (Note: Button is automatically hidden if an edit button is present in a cell)	EDITBUTTON plugin setting
  buttonrow	Set to top to put the edit buttons above the table.	bottom
  javascriptinterface	Use javascript to directly move and delete row without page refresh. Enable with "on", disable with "off".	JAVASCRIPTINTERFACE plugin setting
  redirectto	Set up a return page after saving changes. e.g By setting redirectto="%BASEPAGE%", you can return to base page if your editable table is included by another page.	(none)

Using TWiki Variables in the Format Parameter

• • - Move a row by clicking this button next to the row to be moved, then at a destination.

• Visit configure in your TWiki installation, and enable the plugin in the {Plugins} section.

<--
   Contributions to this plugin are appreciated. Please update the plugin page
   at http://twiki.org/cgi-bin/view/Plugins/EditTablePlugin or provide feedback
   at http://twiki.org/cgi-bin/view/Plugins/EditTablePluginDev.
   If you are a TWiki contributor please update the plugin in the SVN repository.
-->

• Supported attributes:

  Attribute	Comment	Default
  header	Specify the header format of a new table like "|*Food*|*Drink*|". Useful to start a table with only a button	(no header)
  format	The format of one column when editing the table. A cell can be a text input field, or any of these edit field types: • Text input field (1 line):   | text, <size>, <initial value> | • Textarea input field:   | textarea, <rows>x<columns>, <initial value> | • Drop down box:   | select, <size>, <option 1>, <option 2>, etc* |   * only one item can be selected • Radio buttons:   | radio, <size*>, <option 1>, <option 2>, etc |   * size indicates the number of buttons per line in edit mode • Checkboxes:   | checkbox, <size*>, <option 1>, <option 2>, etc |   * size indicates the number of checkboxes per line in edit mode • Fixed label:   | label, 0, <label text> | • Row number:   | row, <offset> | • Date:   | date, <size>, <initial value>, <DHTML date format*> |   * see Date Field Type	"text, 16" for all cells
  changerows	Rows can be added and removed if "on" Rows can be added but not removed if "add" Rows cannot be added or removed if "off"	CHANGEROWS plugin setting
  quietsave	Quiet Save button is shown if "on", hidden if "off"	QUIETSAVE plugin setting
  include	Other topic defining the EDITTABLE parameters. The first %EDITTABLE% in the topic is used. This is useful if you have many topics with the same table format and you want to update the format in one place.	(none)
  helptopic	Topic name containing help text shown below the table when editing a table. The %STARTINCLUDE% and %STOPINCLUDE% variables can be used in the topic to specify what is shown.	(no help text)
  headerislabel	Table header cells are read-only (labels) if "on"; header cells can be edited if "off" or "0"	"on"
  editbutton	Set edit button text, e.g. "Edit this table"; set button image with alt text, e.g. "Edit table, %PUBURL%/%SYSTEMWEB%/TWikiDocGraphics/edittopic.gif"; hide edit button at the end of the table with "hide" (Note: Button is automatically hidden if an edit button is present in a cell)	EDITBUTTON plugin setting
  buttonrow	Set to top to put the edit buttons above the table.	bottom
  javascriptinterface	Use javascript to directly move and delete row without page refresh. Enable with "on", disable with "off".	JAVASCRIPTINTERFACE plugin setting
  redirectto	Set up a return page after saving changes. e.g By setting redirectto="%BASEPAGE%", you can return to base page if your editable table is included by another page.	(none)

• One line description, shown in the TextFormattingRules topic:

• The Plugin depends on the viewauth script to authenticate the user. As described in TWikiAccessControl, copy the view script to viewauth (or better, create a symbolic link) and add viewauth to the list of authenticated scripts in the .htaccess file.

• Set JAVASCRIPTINTERFACE to 1 to be able to directly move and delete row without page refresh. Can be overridden with parameter javascriptinterface.

Simply add an [ Edit table ] button to an existing table by writing %EDITTABLE{}% directly above the table. This can be added to tables that are formatted with TablePlugin: add the EDITTABLE variable just above or below the TABLE tag. It can also be used without any TABLE tag.

Customize entry fields by specifying the format: use a text field, a drop down box, a date field, radio buttons or checkboxes.

Multiple tables per topic are editable, but only one at a time can be edited.

• Supported attributes:

  Attribute	Comment	Default
  header	Specify the header format of a new table like "|*Food*|*Drink*|". Useful to start a table with only a button	(no header)
  format	The format of one column when editing the table. A cell can be a text input field, or any of these edit field types: • Text input field (1 line):   | text, <size>, <initial value> | • Textarea input field:   | textarea, <rows>x<columns>, <initial value> | • Drop down box:   | select, <size>, <option 1>, <option 2>, etc* |   * only one item can be selected • Radio buttons:   | radio, <size*>, <option 1>, <option 2>, etc |   * size indicates the number of buttons per line in edit mode • Checkboxes:   | checkbox, <size*>, <option 1>, <option 2>, etc |   * size indicates the number of checkboxes per line in edit mode • Fixed label:   | label, 0, <label text> | • Row number:   | row, <offset> | • Date:   | date, <size>, <initial value>, <DHTML date format*> |   * see Date Field Type	"text, 16" for all cells
  changerows	Rows can be added and removed if "on" Rows can be added but not removed if "add" Rows cannot be added or removed if "off"	CHANGEROWS plugin setting
  quietsave	Quiet Save button is shown if "on", hidden if "off"	QUIETSAVE plugin setting
  include	Other topic defining the EDITTABLE parameters. The first %EDITTABLE% in the topic is used. This is useful if you have many topics with the same table format and you want to update the format in one place.	(none)
  helptopic	Topic name containing help text shown below the table when editing a table. The %STARTINCLUDE% and %STOPINCLUDE% variables can be used in the topic to specify what is shown.	(no help text)
  headerislabel	Table header cells are read-only (labels) if "on"; header cells can be edited if "off" or "0"	"on"
  editbutton	Set edit button text, e.g. "Edit this table"; set button image with alt text, e.g. "Edit table, %PUBURL%/%SYSTEMWEB%/TWikiDocGraphics/edittopic.gif"; hide edit button at the end of the table with "hide" (Note: Button is automatically hidden if an edit button is present in a cell)	EDITBUTTON plugin setting
  buttonrow	Set to top to put the edit buttons above the table.	bottom
  javascriptinterface	Use javascript to directly move and delete row without page refresh. Enable with "on", disable with "off".	JAVASCRIPTINTERFACE plugin setting
  redirectto	Set up a return page after saving changes. e.g By setting redirectto="%BASEPAGE%", you can return to base page if your editable table is included by another page.	(none)

Using TWiki Variables in the Format Parameter

TWiki variables like %Y% in <initial value> (of text input field) and <label text> (of fixed label) will get expanded when a new row is added.

This is useful to write variables like dates into the table.

For example:

%EDITTABLE{ format="| label, 0, %SERVERTIME{"$day $mon $year $hour:$min"}% |" }%

... will get expanded to 10 Nov 2024 15:05 when the new row is created.

To prevent variable expansion: escape the format variable with formatting tokens (particularly $percnt).

For example:

%EDITTABLE{ format="| text, 20, $percntY$percnt |" }%

... will create a new row with $percntY$percnt. In view mode this is temporarily translated to %Y% and subsequent rendered as .

The date field type allows one to choose a date with a popup calendar. Popup calendar works with all modern browsers. The date picker button is inactive if the browser cannot support the popup calendar or if javascript is disabled.

• • - turn the table into edit mode

• • - save your changes
  • - save your changes without alerting subscribed WebNotify users
  • - add row to the table (if enabled)
  • - remove last row from the table (if enabled)
  • - cancel without saving and release edit lock
  • - Move a row by clicking this button next to the row to be moved, then at a destination.
  • - Deletes the row next to this button.

Nr	Text field	Drop down	Mood	Timestamp
1		one two three four		26 Jun 2002 12:30
2		one two three four		27 Jun 2002 12:40

<-- /editTable -->

• Set JAVASCRIPTINTERFACE to 1 to be able to directly move and delete row without page refresh.
  • Set JAVASCRIPTINTERFACE = 1

• Default edit button: Specify button text, or specify alternate text, image URL. Note: Texts inside %MAKETEXT{}% are translated into other languages.
  • #Set EDIT_BUTTON = Edit table
  • Set EDIT_BUTTON = Edit this table,
  • Set SAVE_BUTTON = Save table
  • Set QUIET_SAVE_BUTTON = Quiet save
  • Set ADD_ROW_BUTTON = Add row
  • Set DELETE_LAST_ROW_BUTTON = Delete last row
  • Set CANCEL_BUTTON = Cancel

• Default help texts
  • Set INCLUDED_TOPIC_DOES_NOT_EXIST = Warning: 'include' topic does not exist!

Installation Instructions

• Unzip EditTablePlugin.zip in your ($TWIKI_ROOT) directory.
• Alternatively,
  • Manually resolve the dependencies listed below. None

• (Dakar) Visit configure in your TWiki installation, and enable the plugin in the {Plugins} section.

Nr	Text field	Drop down	Mood	Timestamp
1	hello table	one		26 Jun 2002 12:30
2		two		27 Jun 2002 12:40

<-- /editTable -->

• • - turn the table into edit mode

• • - save your changes
  • - save your changes without alerting subscribed WebNotify users
  • - add row to the table (if enabled)
  • - remove last row from the table (if enabled)
  • - cancel without saving and release edit lock

• Bug: The Plugin fails if the table is at the very end of the topic (without a new line) Always ensure there is a newline after the table
• This Plugin does not support TWiki table formatting like Multi-span cells (e.g. | ... ||) and cell justification (e.g. |  centered  |   right |)
• There is a performance issue when editing a large table, say, with more then 50 rows
• Variables like %ATTACHURL% get expanded unless they are in a label
• You cannot put two %EDITTABLE{}% statements on the same line in the source
• You can include %-vars now in select values, by quoting them with <nop>, as in %<nop>X% for %X%, say for instance:

• Default flag for quiet save option: on to show the Quiet Save button, off to hide
  • Set QUIETSAVE = on

• Default edit button: Specify button text, or specify alternate text, image URL
  • #Set EDITBUTTON = Edit table
  • Set EDITBUTTON = Edit this table,

Initial Values

By default, variables in <initial value> (of text input field) and <label text> (of fixed label) get expanded when a new row is added. This can be used for example to add a timestamp to a label. You can escape characters if you do not want that:

Date Field Type

The date field type allows one to choose a date with a popup calendar. Popup calendar works for Netscape 6.0 or better, all other Gecko-based browsers, Internet Explorer 5.0 or better for Windows, Opera 7 and Konqueror 3.1.2. The ... button is inactive if the browser cannot support the popup calendar. It uses the nice Mishoo DHTML calendar, see also TWiki:Codev/JavaScriptDatePickerForForm

Per Cell Settings

The edit field type can be defined for each table cell by placing an %EDITCELL{ "type, ..." }% variable after the cell content. This is useful to override the per column %EDITTABLE{ format="..." }% settings, or to create tables with key/value rows. All edit field types of the format="..." parameter are supported, e.g. to define a text field, type: | cell content %EDITCELL{ "text, 20" }% |

It is also possible to place the edit button into a cell instead of default location below the table. Type | %EDITCELL{ "editbutton, 1, Edit this table" }% | to show a button, or | %EDITCELL{ "editbutton, 1, Edit table, Image-URL" }% | to show a button image with alternate text.

Note: The EDITCELL variable cannot be used by itself; place an EDITTABLE variable at the beginning of a table where you want to use EDITCELL variables.

• • Set SHORTDESCRIPTION = Edit TWiki tables using edit fields, date pickers and drop down boxes

• Default text for edit button:
  • Set EDITBUTTON = Edit table

• The Plugin depends on the viewauth script to authenticate the user. As described in TWikiAccessControl, copy the view script to viewauth (or better, create a symbolic link) and add viewauth to the list of authenticated scripts in the .htaccess file.