Versions Compared

Key

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

...

Panel
borderColorGreen
borderWidth1
titleBGColor#ddffcc
borderStylesolid
titleDefinition

Plugin Template Pack aims to factorize repetitive configurations of the same plugin throughout the same app in one place to ease future maintenance. It currently supports:-

with more plugin types to be supported in the future.

This plugin source code is available in a new open source repository at https://github.com/jogetoss/plugin-template-pack. JogetOSS is a community-led team for open-source software related to the Joget no-code/low-code application platform. Projects under JogetOSS are community-driven and community-supported, and you are welcome to contribute to the projects.

...

2. Go to the "Releases" page (See Figure 1).

Figure 1: Release page link

3. Click on the .jar file to initiate the download (See Figure 2).

Figure 2: Plugin-template-pack .jar file

...

2. Log in as admin and click on Design New App  (See Figure 3) or click on existing application.

Figure 3: Design New App

3. For new applications, fill up the App ID with camel case, and App Name, and click on the "Save" button. (See Figure 4)

Figure 4: Fill up App Details

4.  Create a New Form, fill up Form ID in camel case, Form Name, and Table Name then click on the Save button (See Figure 5).

Figure 5: Fill up Form Details

5. Fill up the form with several fields, save it and then click the "Generate App" button (See Figure 6).

Figure 6: Save Form and Generate App

6. After Clicking the "Generate App" button, generate the app with CRUD and Datalist included (See Figure 7).

Figure 7: Generate CRUD and Datalist

8.  After generating the app, Launch the UI Builder  by clicking on the newly created CRUD. (See Figure 8).

Figure 8: Enter UI builder

9. Navigate the user view menu elements and add the "Plugin Template Management" to the User view Menu. (See Figure 9).

Figure 9: Plugin Template Management

...

Edit Plugin Template Management

Figure 10: Edit Plugin Template Management

NameDescription
IDThe  'ID'  in the property editor is a unique identifier. The value of this property is auto-generated.
Custom ID

Item link slug. It is an Optional field

Info
titleInfo

Ensure that value defined here is  unique  to other userview menus in the app since the  first matching/conflicting ID  will take precedence in page loading.

LabelMenu label to be displayed to the end-user. It is a Mandatory field.

UI

Figure 11: UI (List) properties of Plugin Template Management

NameDescription
Button Position

The position of buttons  in the Userview:

  • Top Left
  • Top Right
  • Bottom Left
  • Bottom Right
  • Top Left & Bottom Left
  • Top Right & Bottom Right
Selection Type

The type record selector in the userview:

  • Multiple: Allow users to select multiple or all the records simultaneously.
  • Single: Allow users to select only one record at a time.
Selector Position

The position of the record selector in the userview:

  • Left
  • Right
  • Both left & right
  • No
New Record Button Label

New Record Button Label to be displayed to the end-user.

Default   Value: New

Edit Link Label

Edit Record Button Label to be displayed to the end-user.

Default   Value: Edit

Delete Button Label

Delete Record Button Label to be displayed to the end-user.

Default   Value: Delete

Custom HeaderCustom Header in HTML.
Custom FooterCustom Footer in HTML

Figure 12: UI (Add) properties of Plugin Template Management

NameDescription
Cancel Button Label

Cancel Button Label to be displayed to the end-user.

Default   Value: Cancel

Save Button Label

Save Button Label to be displayed to the end-user.

Default   Value: Save

Custom HeaderCustom Header in HTML.
Custom FooterCustom Footer in HTML

Figure 13: UI (Edit) properties of Plugin Template Management

NameDescription

Back Button Label

Back Button Label to be displayed to the end-user.

Default   Value: Back

Save Button Label

Save Button Label to be displayed to the end-user.

Default   Value: Edit

Custom HeaderCustom Header in HTML.
Custom FooterCustom Footer in HTML

UI of Plugin Template Management

UI List

Image RemovedImage Added

Figure 15 14: UI List of Plugin Template Management

UI (Add)

Figure 16 15: UI (Add) of Plugin Template Management 

UI (Edit)

Figure 17 16: UI (Edit) of Plugin Template Management

...

The plugin types it supports, for now, are as follows: