EditRowPlugin

Inline edit for tables

Features:

1. You can edit one row, or even one cell at a time, instead of having to edit the entire table.
2. Supports footer rows.
3. Supports sorting columns in tables using Javascript, avoiding the round-trip to the server required by TablePlugin.
4. Simple interface to moving rows around in the table, deleting and adding rows.
5. Gets row numbering right (takes account of headers).
6. It's much faster than the individual plugins it replaces.
7. (geeky) Coded using a clean object-oriented architecture, which makes it easily extensible.
8. (geeky) Uses a simple REST interface for saving changes, which allows Javascript table editors to use the same interface to save.
9. (geeky) Tolerant to Javascript being disabled in the browser

Note that this plugin is designed for use with tables of up to ~1000 rows. Tables larger than this will work, but they put considerable stress on the browser and the server. For manipulating larger tables, you are recommended to investigate Foswiki:Extensions.JQGridPlugin or Foswiki:Extensions.JQDataTablesPlugin

This plugin makes some changes on the server immediately, such as add and delete rows. Cancel does not roll back server side changes. If necessary, roll back changes using the More topic actions "revert".

Usage

Works like the EditTablePlugin (it uses exactly the same %EDITTABLE macro) and you can use it to edit the entire table, or just one row at a time.

An %EDITTABLE{...}% in the topic will be associated with the next table in the topic. If there is no existing table, or another %EDITTABLE{...}% is seen before the next table, then a new table will be created.

Parameters:

• format - The format of the cells in a row of the table. The format is defined like a table row, where the cell data specify the type for each cell. For example, format="| text,16 | label |". Cells can be any of the following types:
  • text, <size>, <initial value> Simple text field. Initial value is optional.
  • textarea, <rows>x<columns>, <initial value> Multirow text box. Initial value is optional.
  • select, <size>, <option 1>, <option 2>, etc Select one from a list of choices.
  • radio, <size>, <option 1>, <option 2>, etc. Radio buttons. size indicates the number of buttons per line in edit mode.
  • checkbox, <size>, <option 1>, <option 2>, etc Checkboxes. size indicates the number of buttons per line in edit mode.
  • label, 0, <label text> Fixed label.
  • row The row number, automatically worked out.
  • date, <size>, <initial value>, <DHTML date format> Date. Initial value and date format are both optional.
• changerows - Rows can be added and removed if "on". Rows can be added but not removed if "add". Defaults to the value of the preference CHANGEROWS, or "on" if it isn't set.
• disable - By default, the plugin shows both full table and individual row editing controls. You can choose to disable one or both of these modes using the disable parameter, by setting it to row or full (or row,full to disable all editing and just leave sorting). If full table editing is disabled, but changerows is on, then the (edit table) button will be replaced with a (add row) button. Defaults to the value of the preference EDITROWPLUGIN_DISABLE, or none if it isn't set.
• buttons - set to left or right (the default) to position edit controls in the first or last columns in the table. buttons="right" may be required if you are using other plugins that expect a certain column order, such as TablePlugin.
• quietsave - Quiet Save button is shown if "on". Defaults to the value of the preference QUIETSAVE, or off if it isn't set.
• include - Name of another 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.
• headerrows - Number of rows to treat as headers. Header rows are not editable, and will not be sorted. headerislabel is also supported for EditTablePlugin compatibility (equivalent to headerrows="1")
• header - Specify the single-row header format of a new table. For example, "|*Food*|*Drink*|". Provided to allow you to create a new table in a document, and to have a header that is truly readonly. If header is defined on an empty table then a header row will be automatically created.
  NOTE: if neither header nor headerrows is given, but there are existing headers in the table (rows in which every column is bold) then those rows will automatically be taken as the table header.
• footerrows - Number of rows to treat as footers. Footer rows are not editable and will not be sorted.
• orientrowedit - unique to EditRowPlugin, this parameter controls the orientation of a row when it is being edited. It can be set to horizontal (the default) or vertical, which will present the columns of the row as rows in the editor. This makes editing very wide tables much easier. Has no effect in whole table editing mode.
• helptopic Topic name containing help text shown when editing a table. The %STARTINCLUDE% and %STOPINCLUDE% markers can be used in the topic to specify what is shown. Note that newlines are removed from the included text so the that text can be used inside a table.
• js gives local, per-table control over the EDITROWPLUGIN_JS preference described below.

Table rows are shown with a row edit button in the first column, and a table edit button after the table. When the table is edited, then a number of buttons may be shown depending on the settings of changerows and quietsave.

• saves the changes
• saves without notification.
• cancels the open edit
• The following actions are applied to the topic on the server immediately and are not reverted by the Cancel action,
  • adds a new row after the current row, taking for its contents the initial values specified in the EDITTABLE macro.
  • deletes the row.
  • Move this row up one row in the table
  • Move this row down one row in the table

Per Cell Settings

An individual edit field type can be defined for each individual table cell. Place an %EDITCELL{ "type, ..." }% macro at the end of 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. For example, to define a text field, type: | cell content %EDITCELL{ "text, 20" }% |

Note: The %EDITCELL{}% macro cannot be used by itself; place an %EDITTABLE{ }% macro at the beginning of a table where you want to use %EDITCELL{ }% macros.

Examples

Copy the following examples and paste them into a topic in the Sandbox web (or another web where you have write access). The EditRowPlugin is not enabled on this site, so the examples will be disabled.

Example 1

%EDITTABLE{ format="| row, -1 | text, 20, init | select, 1, not started, starting, ongoing, completed | radio, 3,:-),:-I,:-( | date, 20 |" changerows="on" quietsave="on"}%
| *Nr* | *Project* | *State* | *Progress* | *Timestamp* |
| 1 | Sliced yoghourt | completed | :-) | 26 Jun 2002 |
| 2 | Cubical turkeys | not started | :-( | 27 Oct 2007 |
| 3 | Self-eating burritos | ongoing | :-D | 1 Apr 2008 | 
| 4 | Unified field theory | completed | :-) | 1 Apr 2012 |

Example 2

%EDITTABLE{ format="| label,12 | textarea, 3x30 |" }%
| *Model* | *Description* |
| 345TG66 | Short, with sightly concave upper surface, and devilish nuts |
| 9A-11 | A new model for 2007, but not quite as pretty as the 9A-10 |
| RR717-D | Solid performer, dependable in vacuum grinders |

Example 3

%EDITTABLE{ format="| text,100 | text,100 |" orientrowedit="vertical" headerislabel="on"}%
| *Line* | *Explanation* |
| He took his _vorpal_ sword in hand | A vorpal sword is made from broken bits of Commodore 64 disk-drives |
| Long time the _manxome_ foe he sought | manxome: possibly from 'manky'; or from the Isle of Man |
| So rested he by the _Tumtum_ tree, | Tumtum is a Nilo-Saharan language and people |
| And stood awhile in _thought_ | _thought_ a process not often employed by example writers |

Example 4

%EDITTABLE{ format="| label | text, 40 |" }%
|*Key*|*Value*|
| Name: | John Smith |
| Gender: | M %EDITCELL{select, 1, , F, M}% |
| DOB: | 18 October 2007 %EDITCELL{date, 10}% |
| City: | New York |

Javascript Editing

%EDITTABLE{ format="| text,12 | textarea, 3x30 |" js="assumed"}%

When a table is editable and Javascript is enabled, then when the user rolls the mouse over a table row:

• individual table cells have a yellow stain on the corner that can be clicked to open an in-place editor,
• table rows that contain at least one editable cell can be manually sorted using drag-and-drop, by dragging the (though beware that a TABLE tag with an initsort will override this, which can be confusing),

Table columns can be sorted in the browser, by clicking the heading above the row.

Note that javascript editing is automatically disabled if:

• The current user does not have CHANGE access to the topic
• No user is logged in, but the rest script is listed in the {AuthScripts} admin setting.

Preferences

The plugin interprets a couple of preferences, in common with the EditTablePlugin.

Also, the plugin has a couple of its own settings:

These preferences can be defined in SitePreferences, in WebPreferences for an individual web, or in the topic.

There is also a configure (expert) setting that allows you to change the name of the macro used to carry table editor parameters. This is usually EDITTABLE but can be changed to help work around problems with other plugins.

Installation Instructions

You do not need to install anything in the browser to use this extension. The following instructions are for the administrator who installs the extension on the server.

Open configure, and open the "Extensions" section. "Extensions Operation and Maintenance" Tab -> "Install, Update or Remove extensions" Tab. Click the "Search for Extensions" button. Enter part of the extension name or description and press search. Select the desired extension(s) and click install. If an extension is already installed, it will not show up in the search results.

You can also install from the shell by running the extension installer as the web server user: (Be sure to run as the webserver user, not as root!)

cd /path/to/foswiki
perl tools/extension_installer <NameOfExtension> install

If you have any problems, or if the extension isn't available in configure, then you can still install manually from the command-line. See https://foswiki.org/Support/ManuallyInstallingExtensions for more help.

Using the REST API

The plugin provides a couple of useful REST handlers. Javascript developers may find this API useful when developing their own tools that manipulate tables.

There are two entry points, get and save. The get handler can be used to retrieve the contents of a table. Parameters are:

• erp_topic the web.wikiname of the topic
• erp_table the table (numbered from 1)
• erp_row - the row (numbered from 1)
• erp_col - the column (numbered from 1)

The handler returns a row, a column, or the entire table depending on the presence of the erp_row and erp_col parameters. If neither is given, the entire table is returned. If only erp_row is given, just that row will be returned, etc. The data is returned in JSON format.

For example, a URI to retrieve column 2 from the table EDITTABLE_1 from this topic would look like this:

https://outzenj.com/bin/rest/EditRowPlugin/get?erp_topic=System.EditRowPlugin;erp_table=EDITTABLE_1;erp_col=2

The save handler is used to save cells, and accepts the following parameters:

• erp_topic the web.wikiname of the topic to be changed
• erp_table the table to be changed (numbered from 1)
• erp_row - the row to be changed (numbered from 1, or -1 for the whole table)
• saveRowCmd.x - if nonzero, this is a save
• saveRowQuietlyCmd.x - if nonzero, this is a quietsave
• upRowCmd.x - if nonzero, this is a row move
• downRowCmd.x - if nonzero, this is a row move
• deleteRowCmd.x - if nonzero, this is a row deletion
• cancelCmd.x - if nonzero, this is a cancel
• noredirect - if set, suppresses the redirect and gets a status code instead

The value of each individual cell is stored in a parameter called erp_<table>_<row>_<column>

Relationship to other plugins

EditTablePlugin

At this time most features of EditTablePlugin are supported. Known exceptions are:

• the editbutton parameter,
• Plugin preferences (though global preferences are compatible)

TablePlugin

Javascript sorting in EditRowPlugin is much faster than TablePlugin. However TablePlugin has many features this plugin does not support. For the most part, the two plugins can safely be used together. However if you use a TABLE statement with an initsort parameter, it is likely to cause great confusion, as the table will be re-sorted each time a row is opened for edit, and when the table is edited in full table mode.

All parameters to an applicable %TABLE macro are respected. If the same setting is repeated in the EDITTABLE tag, then that takes precedence even if the TABLE tag is later in the text.

EditTablerowPlugin

Provides the vertical row editing interface like EditTablerowPlugin, with the row being edited shown in context in the table.

Dependencies

Change History