...
- Start the Joget Server and open the App Center.
- Log in as admin and click on the pencil icon on the Expenses Claim to open the Design App. (see Figure 1)
...
Figure 1
3. Click on Expense Claim New and you will be directed to the Form Builder.
4. Click on Advanced Tools at the top.
Figure 2
5. In Advanced Tools, you will find 10 icons in all the builders mentioned with the exception of Form Builder and Process Mapper (see Figure 3).
...
As mentioned in the getting started section. To reveal the advanced tools, the advanced tools button can be clicked.
Figure 4: Show Advanced Tools
...
The > button can be clicked to hide the advanced tools.
Figure 5: Hide Advanced Tools
...
| Thai |
|---|
ตัวแสดงแผนภูมิในแท็บแรกให้ตัวออกแบบแอปที่มีโครงสร้าง/มุมมองคำนิยามโดยรวมเพื่อให้สามารถจุดที่ผิดปกติใดๆและแก้ไขได้ทันทีโดยไม่ต้องยุ่งยากมากเกินไปและเวลาที่ใช้ |
Figure 6 Tree Viewer
...
| Thai |
|---|
คลิกที่ไอคอนแก้ไข (ดินสอ) ทางด้านขวาของโหนดที่ช่วยให้หนึ่งในการกำหนดค่า/แก้ไขคุณสมบัติได้ทันทีเมื่อบันทึกคุณสมบัติ, ผู้ชมต้นไม้จะรีเฟรชตัวเอง. |
Figure 7: Editing a node
...
- Section
- Column
- Custom HTML
- Calculation Field
Figure 8: X-Ray Feature in Form Builder
...
- Name
- Column Number
- Column Mapping
- Column Formatter
Figure 9: X-Ray Feature in List Builder
...
- Category
- Menu ID
- Permission
Figure 10: X-Ray Feature in UI Builder
...
The Permission icon provides the app designer with fine-grain control over managing the permissions of each individual element in the builder.
Figure 11 Form Builder Permission
Clicking on the "Add Permission" button allows one to configure the permission rule for a role/group based on a permission type (see Figure 12).
Figure 12 Configure Permission
...
Visibility controls differ based on Builder types (see Figures 11, 13 & 14)
Figure 13 List Builder Permission
Figure 14 UI Builder Permission
...
For the UI Builder, additional permission can be set at the UI Category element.
Usages
Figure 15: Usages
...
| Description | ||||
|---|---|---|---|---|
In the second tab, the app designer can inspect where the current entity is being used. From the screenshot example above, we can tell that the form is being used in another form and also being part of a workflow process. With such a feature, the app designer will be able to manage the form design well within the scope of its usage.
|
Table
Figure 16: Table
...
The diagrams can be clicked to reveal more detailed information about the table such as which forms use the table and what part of the table is having a relationship with other tables.
Figure 17: ERD Feature
...
Describes what kind of relationship it has with another entity.
Figure 18: Relationship Description Feature
...
The Existing Table Columns feature displays the existing table columns.
Figure 19: Existing Table Columns feature
...
The Table Usage Feature displays the usage of the Table. Such as where it has been used.
Figure 20: Table Usage Feature
i18n Internationalization
| Chinese |
|---|
国际化 |
Figure 21: i18n Internalization
...
| Description | ||||
|---|---|---|---|---|
Labels defined in the builder will be automatically listed down here for internationalization purposes. We can define in as many languages as we want to.
|
Tooltip
Figure 22: Tooltip feature
...
| Thai |
|---|
ตัวตรวจสอบ Diff (Diff Checker) |
Figure 24: Diff Checker
| Description | ||||||
|---|---|---|---|---|---|---|
The Diff Checker capability makes collaborative work possible without losing the modifications done by other teammates who are working on the same entity at the same time. In this section, one can tell which are the changes that have been made since the initial first load of his/her builder against the copy in the server. Click on the Merge & Update button will ensure that all modifications are merged.
|
JSON Definition
| Chinese |
|---|
JSON定义 |
Figure 25: JSON Definition
...
XPDL stands for XML Process Definition Language, is a format standardized by the Workflow Management Coalition (WfMC) to interchange business process definitions between different workflow products, which is why this feature is only available in the process builder see figure 26.
Figure 26: XPDL Feature in Process Builder
Figure 27: XPDL Code
...
The screenshot is a feature that takes a screenshot of what it will look like in the UI. The screenshot can be downloaded by clicking the Download button located at the top right corner. This is useful for instance, sharing the design or look and feel to a client or even an employer.
Figure 28: Screenshot Feature
...