Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

Panel
nameblue

This section describes how custom data entry pages are created.

 

What does this section cover?

Table of Contents

Create Custom Data Entry Pages

Whilst on a For an introduction to data entry page, the developer will be able to know if that page is custom or not by the links provided on the developer toolbar.

Data Entry Page ToolbarImage Removed

In a data entry screen, if under the link “Development” there is an option “Create custom page”, it means that no custom definition file has been created yet. If there is an option “Edit custom page”, it means that a custom definition file has been created. The difference from a custom summary page is that a custom data entry page can have multiple layouts, however only one can be active at any time.

Custom Data Entry PageImage RemovedBy clicking on the link “Page Designer”, the developer can create new layout files, choose which version to use, copy, delete or edit the current custom layout file.

Custom Layout PageImage Removed

Creating Custom Data Entry Pages through the Page Designer

In order to create custom data entry pages through the page designer, the developer needs to navigate to the data entry page he desires to modify in the system, and click the link “Create custom page”.

Custom Definition FileImage RemovedThis creates an empty template of a definition file, in which the developer can override current components, or add his own.

Custom Definition FileImage RemovedTo create a custom data entry layout page, the developer must first click on the link "Page Designer", and then click on "Create New Page Version". The developer can choose a name to give this layout, since as previously stated, there can be more than one layout page (but only one active). This copies the release layout page, and allows the developer to add/remove sections and components, and have complete control over how the page should be viewed. The developer can also choose to copy an existing custom layout instead of the release, or delete any that are no longer in use.

Custom Layout FileImage RemovedCustom Layout FileImage Removed

The result of this change can be viewed in the newly created custom data entry page.

Custom Data Entry PageImage Removed

In the case of having more than one custom layout page, to activate a certain one, the developer must again click on the link "Page Designer", and check the checkbox "Use This Version" of the layout that is required.

Custom Layout FileImage Removedpages, go to Developing data entry pages (Deprecated).

Create New Data Entry Pages

To create a new data entry page, you need to create two XML files: a layout file and a definition file under <custom_project>/web/WebContent/pages/dataEntry/<module_name>

The custom data entry definition file for the new page must have a unique file path.

The custom data entry layout file for the new page must follow this naming convention: <definition_page_filename>layout.xml. More than one layout files can exist per data entry definition page. In such cases, a default data entry layout file per database must be defined in templates properties file (templates.properties)

Ui expand
titleNew Data Entry Page Example
Code Block
languagexml
titlestatus.xml
collapsetrue
 <?xml version="1.0" encoding="UTF-8"?><page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="../../../xsd/dataEntry.xsd">
	<id>jobs/status</id>
	<name>key_status</name>
	<module>JOBS</module>
	<functioncall>
		<functions>
			<function>
			</function>		
		</functions>
	</functioncall>
	
	<datasources>
		<datasource>
			<key>form</key>
			<classname>com.crm.web.generator.datasource.DTODatasource</classname>
		</datasource>
	</datasources>
	<mainmenu>
		<components>
			<component>
				<id>cmpHome</id>
				<name>key_home</name>
				<visiblemodes>read</visiblemodes>
				<elements>
					<button>
						<id>btnHome</id>
						<name>key_home</name>
						<setmode>read</setmode>
						<refresh>page</refresh>
						<url>page.do?act=summary&amp;xml=jobs/statuses</url>
					</button>
				</elements>
			</component>
			<component>
				<id>cmpNew</id>
				<name>key_new</name>
				<visiblemodes>read</visiblemodes>
				<elements>
					<button>
						<id>btnNew</id>
						<name>key_new</name>
						<setmode>new</setmode>
						<refresh>page</refresh>
						<functioncall>
							<functions>
								<function>
									<type>ejb</type>
									<classname>ejb/COMPANYCRMUIJobStatus</classname>
									<functionname>createButton</functionname>
									<resultaction>replace</resultaction>
									<datatype>root</datatype>
								</function>
							</functions>
						</functioncall>
					</button>
				</elements>
			</component>
			<component>
				<id>cmpEdit</id>
				<name>key_edit</name>
				<visiblemodes>read</visiblemodes>
				<elements>
					<button>
						<id>btnEdit</id>
						<name>key_edit</name>
						<visibilityconditions>'[[getValue,java.lang.String,isEditable]]'!='0'</visibilityconditions>
						<setmode>edit</setmode>
						<refresh>page</refresh>
						<disableonclick>true</disableonclick>
						<functioncall>
							<functions>
								<function>
									<type>ejb</type>
									<classname>ejb/COMPANYCRMUIJobStatus</classname>
									<functionname>editButton</functionname>
									<resultaction>replace</resultaction>
									<datatype>root</datatype>
									<parameters>
										<parameter>
											<value>[[getDTO]]</value>
											<datatype>java.lang.Object</datatype>
										</parameter>
									</parameters>
								</function>
							</functions>
						</functioncall>
					</button>
					<button>
						<id>btnEdit</id>
						<name>key_edit</name>
						<visibilityconditions>'[[getValue,java.lang.String,isEditable]]'=='0'</visibilityconditions>
						<style>TopToolbarItemsDisabled</style>
					</button>
				</elements>
			</component>
			<component>
				<id>cmpDelete</id>
				<name>key_delete</name>
				<visiblemodes>read</visiblemodes>
				<elements>
					<button>
						<id>btnDelete</id>
						<name>key_delete</name>
						<visibilityconditions>'[[getValue,java.lang.String,isDeletable]]'!='0'</visibilityconditions>
						<setmode>read</setmode>
						<refresh>page</refresh>
						<url>page.do?act=summary&amp;xml=jobs/statuses</url>
						<functioncall>
							<functions>
								<function>
									<type>ejb</type>
									<classname>ejb/COMPANYCRMUIJobStatus</classname>
									<functionname>deleteButton</functionname>
									<datatype>root</datatype>
									<parameters>
										<parameter>
											<value>[[getDTO]]</value>
											<datatype>java.lang.Object</datatype>
										</parameter>
									</parameters>
								</function>
							</functions>
						</functioncall>
					</button>
					<button>
						<id>btnDelete</id>
						<name>key_delete</name>
						<visibilityconditions>'[[getValue,java.lang.String,isDeletable]]'=='0'</visibilityconditions>
						<style>TopToolbarItemsDisabled</style>
					</button>
				</elements>
			</component>
			<component>
				<id>cmpSave</id>
				<name>key_save</name>
				<visiblemodes>edit,new</visiblemodes>
				<elements>
					<button>
						<id>btnSave</id>
						<name>key_save</name>
						<setmode>read</setmode>
						<refresh>page</refresh>
						<functioncall>
							<functions>
								<function>
									<type>ejb</type>
									<classname>ejb/COMPANYCRMUIJobStatus</classname>
									<functionname>saveButton</functionname>
									<resultaction>replace</resultaction>
									<datatype>root</datatype>
									<parameters>
										<parameter>
											<value>[[getDTO]]</value>
											<datatype>java.lang.Object</datatype>
										</parameter>
									</parameters>
								</function>
							</functions>
						</functioncall>
					</button>
				</elements>
			</component>
			<component>
				<id>cmpCancel</id>
				<name>key_cancel</name>
				<visiblemodes>edit,new</visiblemodes>
				<elements>
					<button>
						<id>btnCancel</id>
						<name>key_cancel</name>
						<setmode>read</setmode>
						<refresh>cancel,page.do?act=summary&amp;xml=jobs/statuses</refresh>
					</button>
				</elements>
			</component>
		</components>
	</mainmenu>
	<main>
		<components>
			<component>
				<id>cmpLifeCycleState</id>
				<name>key_lifecyclestate</name>
				<elements>
					<selectbox>
						<id>slbLifeCycleState</id>
						<lookuptype>ejb</lookuptype>
						<label>key_life_cycle_state</label>
						<datapath>lifeCycleState</datapath>
						<datatype>enum</datatype>
						<classname>com.crm.dataobject.jobs.JobLifeCycleState</classname>
						<reload>true</reload>
						<onload>
							<type>ejb</type>
							<classname>ejb/CRMUIJob</classname>
							<functionname>getLifeCycleStateOptions</functionname>
						</onload>
					</selectbox>
				</elements>
			</component>
		</components>
	</main>
	<details>
		<tabs>
		</tabs>
	</details>
</page>
Code Block
languagexml
titlestatuslayout.xml
collapsetrue
 <?xml version="1.0" encoding="UTF-8"?><page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="../../../xsd/dataEntryLayout.xsd">
	<mainmenu>
		<components>
			<component><id>cmpHome</id></component>
			<component><id>cmpNew</id></component>
			<component><id>cmpEdit</id></component>
			<component><id>cmpDelete</id></component>
			<component><id>cmpSave</id></component>
			<component><id>cmpCancel</id></component>
		</components>
	</mainmenu>
	<main>
		<view>
			<type>areas</type>
			<screenareas>
				<screenarea>
					<leftscreenarea>
						<sections>
							<section><id>secMainInformation</id></section>
							<section><id>secLogInformation</id></section>
						</sections>
					</leftscreenarea>
				</screenarea>
			</screenareas>
		</view>
		<sections>
			<section>
				<id>secMainInformation</id>
				<name>key_main_information</name>
				<disable>false</disable>
				<instruction>key_instruction_jobs_status_sec_main_information</instruction>
				<left>
					<components>
						<component><id>file:general/name.xml</id></component>
						<component><id>file:general/altCode.xml</id></component>
						<component><id>cmpLifeCycleState</id></component> 
					</components>
				</left>
				<right>
					<components>
						<component><id>file:general/description_rowspan_2.xml</id></component>
					</components>
				</right>
			</section>
			<section>
				<id>secLogInformation</id>
				<name>key_log_information</name>
				<disable>false</disable>
				<left>
					<columns>3</columns>
					<components>
						<component>
							<id>file:loginfo/logInfoGroup.xml</id>
							<colspan>3</colspan>
						</component>
					</components>
				</left>
			</section>
		</sections>
	</main>
	<details>
		<tabs>
		</tabs>
	</details>
</page>

 

Image Added

 

As you can see in the example above, for the name, alternative code and log information components, generic components were used. For more information on generic components and how to use them, go to Use Generic Components (Deprecated).

Customise Existing Data Entry Pages

To extend the system's release functionality, by adding new components to an existing data entry page, both custom data entry definition and layout files must be created. To extend the system's release functionality, by just changing the layout of the existing components, only a custom data entry layout file must be created. Both definition and layout files must be created under  <custom_project>/web/WebContent/pages/dataEntry/<module_name>.

The custom data entry definition file must follow this naming convention: <release_definition_page_filename>Custom.xml and include the new components ONLY.

The custom data entry layout file must have a unique file path, include ALL sections and components that need to be displayed and be defined in templates.properties file.

Ui expand
titleCustomise Data Entry Page Example
Code Block
languagexml
titlecontactInformationCustom.xml
collapsetrue
 <?xml version="1.0" encoding="UTF-8"?><page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="../../../xsd/dataEntry.xsd">
	<id>contactinfo/contactInformation</id>
	<datapath>name</datapath>
	<module>CONTACT_INFORMATION</module>
	<functioncall>
		<functions>
			<function>
			</function>		
		</functions>
	</functioncall>
	
	<datasources>
		<datasource>
			<key>form</key>
			<classname>com.crm.web.generator.datasource.DTODatasource</classname>
		</datasource>
	</datasources>
	<mainmenu>
	</mainmenu>
	<main>
		<components>
			<component>
				<id>cmpHomeType</id>
				<name>key_home_type</name>
				<elements>
					<textbox>
						<id>txtHomeType</id>
						<label>key_home_type</label>
						<datapath>ciuserfield2</datapath>
					</textbox>
				</elements>
			</component>
		</components>
	</main>
	<details>
		<tabs>
		</tabs>
	</details>
</page>
 
Code Block
languagexml
titlecontactInformationCustomlayout.xml
collapsetrue
 <?xml version="1.0" encoding="UTF-8"?><page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="../../../xsd/dataEntryLayout.xsd">
	<mainmenu>
		<components>
			<component><id>cmpHome</id></component>
			<component><id>cmpNew</id></component>
			<component><id>cmpEdit</id></component>
			<component><id>cmpDelete</id></component>
			<component><id>cmpSave</id></component>
			<component><id>cmpSaveInModal</id></component>
			<component><id>cmpCancel</id></component>
			<component><id>cmpActions</id></component>
		</components>
	</mainmenu>
	<main>
		<view>
			<type>list</type>
			<screenareas>
				<screenarea>
					<leftscreenarea>
						<sections>
							<section><id>secMainInformation</id></section>
							...
						</sections>
					</leftscreenarea>
				</screenarea>
			</screenareas>
		</view>
		<sections>
			<section>
				<id>secMainInformation</id>
				<name>key_main_information</name>
				<disable>false</disable>
				<left>
					<components>
						...
						<component><id>cmpHomeType</id></component>
					</components>
				</left>
				...
			</section>
			...
		</sections>
	</main>
	<details>
		<tabs>
			...
		</tabs>
	</details>
</page>

Image Added

Templates Properties File

The templates properties file (templates.properties) is used for defining the default data entry layout file, generally or per community, when more than one layout files exist per data entry definition page, and must be created under <custom_project>/web/WebContent/pages/dataEntry.

To define the default layout of a data entry page, you have to add the following line to templates.properties file: <definition_page_file_path>~organisation~default=<directory_name>/<layout_filename>.xml

To define the default layout of a data entry page for a specific community, you have to add the following line to templates.properties file:  <definition_page_file_path>~community~<community_id>=<directory_name>/<layout_filename>.xml

Note that .xml is omitted from definition_page_file_path. 

If no default layout page is specified for a specific community, the default layout page will be used by the system. If no default layout page is specified either, the release layout page will be used.

Code Block
languagexml
titletemplates.properties
collapsetrue
contactinfo/contactInformation~organisation~default=contactinfo/contactInformationCustomlayout.xml
contactinfo/contactInformation~community~37AABC37AAF75489FC89EEA94C59024D=contactinfo/contactInformationCustom2layout.xml

 

For a full list of data entry page attributes, go to Data Entry Pages Documentation