Revision as of 05:47, June 24, 2011

Form Based Editing in WebProtege

Learn more about how the layout configuration works in WebProtege by following this tutorial.

Examples of form editing widgets

The PropertyFieldPortlet (edu.stanford.bmir.protege.web.client.ui.portlet.propertyForm.PropertyFieldPortlet) supports the form-based editing in WebProtege. The portlet allows the association of a property with an editing widget. There are different types of editing widgets: text field, text area, check box, radio box, combo box, html, instance table, etc. This feature is similar to the form-based editing support in Protege 3.x. The editing widgets can be organized in tabs.

An example of the PropertyFieldPortlet is shown below:

The example shows the tab structure of the portlet. There are examples of a instance textfield widget (ICD title), text fields (code, sorting label), instance table (definition and external definition) and drop-down list (editorial status).

Other examples of editing widgets (check box, radio box, combo box, BioPortal reference widget) are shown in the figure below:

Types of property editing widgets

One or more property editing widgets can be added to a PropertyFormPortlet. The types of widgets are enumerated below:

• textfield - editing of string values in a text field
• textarea - editing of string values in a text area
• combobox - editing of simple or instance values using a drop-down list
• htmleditor - editing of string values using an HTML editor
• multitextfield - editing of string multi-values (for properties with multiple cardinality)

• htmlMessage - embed some HTML text or an external HTML into the portlet
• classselect - widget to set a class as the value of a property. Class is selected from a class tree
• propertyselect - widget to select a property using a property tree
• externalreference - widget to create a reference to an external ontology or terminology stored in BioPortal

Instance widgets (useful for reified instances):

• instancetextfield - if the the property value is an instance, shows in a text field one of the properties of the value instance
• instancecheckbox - show as checkboxes an instance value set (multiple cardinality)
• instanceradiobutton - show as radio box an instance value set (single cardinality)
• grid - shows an instance table widget similar to the rich client (single or multiple cardinality)

Note. The list of available widgets will be extended as needed. The name of the widgets might also change in future releases.

Configuration of the property editing widgets

Unfortunately the only way to configure the widgets in a PropertyFieldPortlet is to edit the layout configuration XML file. We are working on creating a user interface that would simplify the configuration process. Until then, please bear with us.

Each widget has properties associated to it in form of key:value pairs that control the configuration of the widget.

Below is an example of configuring the PropertyFieldPortlet to display for the rdfs:label a multitextfield widget and for the rdfs:comment uses a textarea widget.

<portlet>
	<name>edu.stanford.bmir.protege.web.client.ui.portlet.propertyForm.PropertyFieldPortlet</name>
        <height>200</height>
	<width>0</width>
	<properties>
		<entry>
			<string>tabs</string>
			<list>
				<map>
					<entry>
						<string>title</string>
						<string>Metadata</string>
					</entry>										
					<entry>
						<string>http://www.w3.org/2000/01/rdf-schema#label</string>
						<map>
							<entry>
								<string>name</string>
								<string>http://www.w3.org/2000/01/rdf-schema#label</string>
							</entry>
							<entry>
								<string>label</string>
								<string>Label</string>
							</entry>
							<entry>
								<string>component_type</string>
								<string>multitextfield</string>
							</entry>
							<entry>
								<string>index</string>
								<string>0</string>
							</entry>
						</map>
					</entry>
					<entry>
						<string>http://www.w3.org/2000/01/rdf-schema#comment</string>
						<map>
							<entry>
								<string>name</string>
								<string>http://www.w3.org/2000/01/rdf-schema#comment</string>
							</entry>
							<entry>
								<string>label</string>
								<string>Comment</string>
							</entry>
							<entry>
								<string>component_type</string>
								<string>textarea</string>
							</entry>
							<entry>
								<string>index</string>
								<string>1</string>
							</entry>
						</map>
					</entry>										
				</map>																				
			</list>
		</entry>
	</properties>
 </portlet>

The component_type is one of the types specified in the section above. The first entry in the property of the tabs (E.g. <string>http://www.w3.org/2000/01/rdf-schema#label</string> ) is the property name to which the widget is associated. The name property must point to a unique name for the widget. The label property sets the display label in front of the widget. index specifies on what position in the tab should the widget be placed (0 - top, 1- below 0, etc.).

Different widgets have additional supported properties. Some of them support the read_only property, which can be used to make a widget read-only (in the first figure, ICD 10 code). The grid widget (a.k.a Instance Table Widget) has properties for setting the columns in the table, their width, their type, etc.

More documentation about the properties of the widgets will be added as requested by the users.

Examples

The easiest way to create the XML configuration for a PropertyFieldPortlet is to start with an existing example and change it.

We have some example using this portlet here:

http://smi-protege.stanford.edu/repos/protege/web-protege/branches/who/war/projectConfigurations/configuration_ICD.xml http://smi-protege.stanford.edu/repos/protege/web-protege/branches/who/war/projectConfigurations/configuration_example_property_field_portlet.xml