Versions Compared

Key

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

Table of Contents

 

In this tutorial, we will be following the ในบทเรียนนี้เราจะทำตาม guideline for developing a plugin to develop our  เพื่อพัฒนาปลั๊กอิน JDBC Form Load Binder plugin. Please also refer to this tutorial, ของเรา โปรดอ้างอิงบทช่วยสอนนี้ วิธีการพัฒนา Bean Shell Hash Variable and also a JDBC related plugin  และปลั๊กอินที่เกี่ยวข้องกับ JDBC วิธีการพัฒนา JDBC Options Binder for more details steps. เพื่อรายละเอียดเพิ่มเติม

1.

...

For integration purpose, we would like to load our form data from a different database table instead of Joget form data table.

...

ปัญหาคืออะไร?

เพื่อวัตถุประสงค์ในการรวมเราต้องการโหลดข้อมูลฟอร์มของเราจากตารางฐานข้อมูลอื่นแทนที่จะเป็นตารางข้อมูล Joget

2. ความคิดของคุณในการแก้ปัญหาคืออะไร

...

?

Joget Workflow has provided a plugin type called ได้จัดทำปลั๊กอินที่เรียกว่า Form Load Binder Plugin. We will refer to the former to develop a plugin to support JDBC connection and custom query to load form data.

3. What is the input needed for your plugin?

 เราสามารถอ้างอิงถึงการเชื่อมต่อเพื่อสนับสนุนในการพัฒนาปลั๊กอิน JDBC และ กำหนดค่า query เพื่อโหลดข้อมูลในแบบฟอร์ม

3. อินพุตที่จำเป็นสำหรับปลั๊กอินของเรา?

เพื่อการพัฒนาปลั๊กอิน To develop a JDBC Load binder, we will need the JDBC connection setting and also the custom query to populate the form data based on primary key or  เราจะต้องมีการตั้งค่าการเชื่อมต่อ JDBC และ query ที่กำหนดเองเพื่อเติมข้อมูลแบบฟอร์มตาม primary key หรือ foreign key (for เพื่อ Grid).

  1. Datasource: Using custom datasource or Joget default datasource การใช้แหล่งข้อมูลที่กำหนดเองหรือแหล่งข้อมูลเริ่มต้นของ Joget
  2. Custom JDBC Driver: The JDBC driver for custom datasource ไดรเวอร์ JDBC สำหรับแหล่งข้อมูลที่กำหนดเอง
  3. Custom JDBC URL: The JDBC connection URL for custom datasourceURL การเชื่อมต่อ JDBC สำหรับแหล่งข้อมูลที่กำหนดเอง
  4. Custom JDBC Username: The username for custom datasourceชื่อผู้ใช้สำหรับแหล่งข้อมูลที่กำหนดเอง
  5. Custom JDBC Password: The password for custom datasourceรหัสผ่านสำหรับแหล่งข้อมูลที่กำหนดเอง
  6. SQL Query: The query to populate form data.  query เพื่อเติมข้อมูลแบบฟอร์ม

query ควรจะสนับสนุน syntax เพื่อการอ้างอิงถึง The query should also support a syntax to inject the primary key (For เพื่อ Form/Section) or หรือ foreign key (For เพื่อ Grid element)

Exampleตัวอย่าง:

  1. SELECT * from app_fd_sample where id = ?

4.

...

ผลลัพธ์และผลลัพธ์ที่คาดหวังจากปลั๊กอินของคุณคืออะไร?

คอลัมน์ที่ดึงข้อมูลทั้งหมดจะถูกแมปอัตโนมัติกับฟิลด์ที่มีชื่อคอลัมน์เท่ากับฟิลด์ ID

5. มีทรัพยากร / API ที่สามารถนำกลับมาใช้ใหม่ได้หรือไม่?

เราสามารถอ้างถึงการดำเนินการของอื่น ๆ ที่มีอยู่ 

All retrieved columns are auto mapped to the fields with column name equal to field id. 

5. Are there any resources/API that can be reused?

We can refer to the implementation of other available Form Load Binder plugins. Joget default datasource can be retrieve with AppUtil แหล่งข้อมูลเริ่มต้นของ Joget สามารถเรียกดูได้ AppUtil.getApplicationContext().getBean("setupDataSource").

6.

...

 เตรียม environment

...

ของคุณเพื่อการพัฒนา

 

เราจำเป็นต้องให้ซอร์สโค้ด Joget Workflow ของเราพร้อมและสร้างโดยทำตาม We need to always have our Joget Workflow Source Code ready and builded by following this guideline

The following tutorial is prepared with a Macbook Pro and บทช่วยสอนต่อไปนี้จัดทำขึ้นด้วย Macbook Pro และ Joget Source Code version 5.0.0. Please refer to แนวทางสำหรับการพัฒนาปลั๊กอิน for other platform command.

Let say our folder directory is as follows. 

0. โปรดอ้างอิงถึง แนวทางสำหรับการพัฒนาปลั๊กอิน สำหรับคำสั่งแพลตฟอร์มอื่น ๆ

สมมติว่าไดเรกทอรีโฟลเดอร์ของเรามีดังนี้

Code Block
- Home
  - joget
    - plugins
    - jw-community
      -5.0.0

The ไดเรกทอรี "plugins" directory is the folder we will create and store all our plugins and the ปลั๊กอิน" คือโฟลเดอร์ที่เราจะสร้างและจัดเก็บปลั๊กอินทั้งหมดของเราและไดเรกทอรี "jw-community" directory is where the เป็นที่เก็บซอร์สโค้ด Joget Workflow Source code stored.

เรียกใช้คำสั่งต่อไปนี้เพื่อสร้างโครงการ maven ในไดเรกทอรี "ปลั๊กอิน"Run the following command to create a maven project in "plugins" directory.

Code Block
languagebash
cd joget/plugins/
~/joget/jw-community/5.0.0/wflow-plugin-archetype/create-plugin.sh org.joget.tutorial jdbc_load_binder 5.0.0

Then, the shell script will ask us to key in a version for your plugin and ask us for confirmation before generate the maven project.จากนั้น the shell script จะขอให้เราป้อนปลั๊กอินสำหรับรุ่นของคุณและขอให้เรายืนยันก่อนสร้างโครงการ maven

Code Block
languagebash
Define value for property 'version':  1.0-SNAPSHOT: : 5.0.0
[INFO] Using property: package = org.joget.tutorial
Confirm properties configuration:
groupId: org.joget.tutorial
artifactId: jdbc_load_binder
version: 5.0.0
package: org.joget.tutorial
Y: : y

We should get เราควรได้รับข้อความ "BUILD SUCCESS" message shown in our terminal and a ที่ปรากฏในเครื่องของเราและโฟลเดอร์ "jdbc_load_binder" folder created in ที่สร้างในโฟลเดอร์ "pluginsปลั๊กอิน" folder.

Open the maven project with your favour IDE. I will be using เปิดโครงการ maven ด้วย IDE ที่คุณโปรดปราน เราแนะนำให้ใช้ NetBeans.  

7.

...

เริ่มโค้ด!

a.

...

 การขยาย abstract class

...

ของประเภทปลั๊กอิน

สร้างคลาส Create a "JdbcLoadBinder" class under ภายใต้ "org.joget.tutorial" package. Then, จากนั้น extend the class with ด้วย org.joget.apps.form.model.FormBinder abstract class.

To make it work as a เพื่อให้มันทำงานเป็น Form Load Binder, we will need to implement เราจำเป็นจะต้องใช้อินเตอร์เฟซ org.joget.apps.form.model.FormLoadBinder interface. Then, we need to implement . จากนั้นต้องใช้อินเตอร์เฟซ org.joget.apps.form.model.FormLoadElementBinder interface to make this plugin show as a selection in load binder select box and implement   เพื่อให้ปลั๊กอินนี้แสดงเป็นตัวเลือกในกล่องเลือกโหลด binder และใช้ org.joget.apps.form.model.FormLoadMultiRowElementBinder interface to list it under the load binder select box of . อินเตอร์เฟสเพื่อแสดงรายการภายใต้  select box ของ grid element. 

 Please refer to โปรดอ้างอิงถึง Form Load Binder Plugin.

b.

...

 การดำเนินการของ abstract methods

...

ทั้งหมด

เช่นเคยเราต้องใช้ As usual, we have to implement all the abstract methods ทั้งหมด. We will using เราจะใช้ AppPluginUtil.getMessage method to support i18n and using constant variable เพื่อสนับสนุน i18n และใช้ตัวแปรคงที่ MESSAGE_PATH for เพื่อ message resource bundle directory.

 

Code Block
languagejava
titleImplementation of all basic abstract methods
collapsetrue
package org.joget.tutorial;
 
import org.joget.apps.app.service.AppPluginUtil;
import org.joget.apps.app.service.AppUtil;
import org.joget.apps.form.model.Element;
import org.joget.apps.form.model.FormBinder;
import org.joget.apps.form.model.FormData;
import org.joget.apps.form.model.FormLoadBinder;
import org.joget.apps.form.model.FormLoadElementBinder;
import org.joget.apps.form.model.FormLoadMultiRowElementBinder;
import org.joget.apps.form.model.FormRowSet;
 
public class JdbcLoadBinder extends FormBinder implements FormLoadBinder, FormLoadElementBinder, FormLoadMultiRowElementBinder {
    
    private final static String MESSAGE_PATH = "messages/JdbcLoadBinder";
    
    public String getName() {
        return "JDBC Load Binder";
    }
 
    public String getVersion() {
        return "5.0.0";
    }
    
    public String getClassName() {
        return getClass().getName();
    }
 
    public String getLabel() {
        //support i18n
        return AppPluginUtil.getMessage("org.joget.tutorial.JdbcLoadBinder.pluginLabel", getClassName(), MESSAGE_PATH);
    }
    
    public String getDescription() {
        //support i18n
        return AppPluginUtil.getMessage("org.joget.tutorial.JdbcLoadBinder.pluginDesc", getClassName(), MESSAGE_PATH);
    }
 
    public String getPropertyOptions() {
        return AppUtil.readPluginResource(getClassName(), "/properties/jdbcLoadBinder.json", null, true, MESSAGE_PATH);
    }
 
    public FormRowSet load(Element element, String primaryKey, FormData formData) {
        throw new UnsupportedOperationException("Not supported yet."); //To change body of generated methods, choose Tools | Templates.
    }
}

Then, we have to do a UI for admin user to provide inputs for our plugin. In getPropertyOptions method, we already specify our ตัวเลือกคุณสมบัติปลั๊กอิน definition file is locate at จากนั้นเราต้องทำ UI สำหรับผู้ใช้ผู้ดูแลระบบเพื่อให้อินพุตสำหรับปลั๊กอินของเรา. ใน getPropertyOptions method, เราได้ระบุ ตัวเลือกคุณสมบัติปลั๊กอิน ของเราไว้ที่ "/properties/jdbcLoadBinder.json". Let us create a ให้เราสร้าง directory "resources/properties" under ภายใต้ "jdbc_load_binder/src/main" directory. After create the หลังจากสร้าง directory, create a file named เราจะพบไฟล์ชื่อ "jdbcLoadBinder.json" in the "properties" folder.ในโฟลเดอร์ "properties"

ในไฟล์ตัวเลือกคุณสมบัติ เราจะต้องเลือกดังต่อไปนี้ โปรดทราบว่าเราสามารถใช้ syntax In the properties definition options file, we will need to provide options as below. Please note that we can use "@@message.key@@" syntax to support i18n in our properties options.  ในการสนับสนุน i18n ตัวเลือกคุรสมบัติของเราได้

Code Block
languagejs
[{
    title : '@@form.jdbcLoadBinder.config@@',
    properties : [{
        name : 'jdbcDatasource',
        label : '@@form.jdbcLoadBinder.datasource@@',
        type : 'selectbox',
        options : [{
            value : 'custom',
            label : '@@form.jdbcLoadBinder.customDatasource@@'
        },{
            value : 'default',
            label : '@@form.jdbcLoadBinder.defaultDatasource@@'
        }],
        value : 'default'
    },{
        name : 'jdbcDriver',
        label : '@@form.jdbcLoadBinder.driver@@',
        description : '@@form.jdbcLoadBinder.driver.desc@@',
        type : 'textfield',
        value : 'com.mysql.jdbc.Driver',
        control_field: 'jdbcDatasource',
        control_value: 'custom',
        control_use_regex: 'false',
        required : 'true'
    },{
        name : 'jdbcUrl',
        label : '@@form.jdbcLoadBinder.url@@',
        type : 'textfield',
        value : 'jdbc:mysql://localhost/jwdb?characterEncoding=UTF8',
        control_field: 'jdbcDatasource',
        control_value: 'custom',
        control_use_regex: 'false',
        required : 'true'
    },{
        name : 'jdbcUser',
        label : '@@form.jdbcLoadBinder.username@@',
        type : 'textfield',
        control_field: 'jdbcDatasource',
        control_value: 'custom',
        control_use_regex: 'false',
        value : 'root',
        required : 'true'
    },{
        name : 'jdbcPassword',
        label : '@@form.jdbcLoadBinder.password@@',
        type : 'password',
        control_field: 'jdbcDatasource',
        control_value: 'custom',
        control_use_regex: 'false',
        value : ''
    },{
        name : 'sql',
        label : '@@form.jdbcLoadBinder.sql@@',
        description : '@@form.jdbcLoadBinder.sql.desc@@',
        type : 'codeeditor',
        mode : 'sql',
        required : 'true'
    }],
    buttons : [{
        name : 'testConnection',    
        label : '@@form.jdbcLoadBinder.testConnection@@',
        ajax_url : '[CONTEXT_PATH]/web/json/app[APP_PATH]/plugin/org.joget.tutorial.JdbcLoadBinder/service?action=testConnection',
        fields : ['jdbcDriver', 'jdbcUrl', 'jdbcUser', 'jdbcPassword'],
        control_field: 'jdbcDatasource',
        control_value: 'custom',
        control_use_regex: 'false'
    }]
}]

Same as เหมือนกับ JDBC Options Binder, we will need to add a test connection button for custom JDBC setting. Please refer to เราจะต้องเพิ่มปุ่มเพื่อทำการทดสอบการเชื่อมต่อกับ JDBC. โปรดอ้างอิงถึง วิธีการพัฒนา JDBC Options Binder on the Web Service Plugin implementation.Once we done the properties option to collect input and the web service to test the connection, we can work on the main method of the plugin which is load method. บนการใช้งาน Web Service Plugin 

มื่อเราทำตัวเลือกคุณสมบัติเพื่อรวบรวมอินพุตและบริการเว็บเพื่อทดสอบการเชื่อมต่อ เราสามารถทำงานกับวิธีการหลักของปลั๊กอินซึ่งเป็นวิธีการโหลด

Code Block
languagejava
    public FormRowSet load(Element element, String primaryKey, FormData formData) {
        FormRowSet rows = new FormRowSet();
        rows.setMultiRow(true);
        //Check the sql. If require primary key and primary key is null, return empty result.
        String sql = getPropertyString("sql");
        if ((primaryKey == null || primaryKey.isEmpty()) && sql.contains("?")) {
            return rows;
        }
        
        Connection con = null;
        PreparedStatement pstmt = null;
        ResultSet rs = null;
        
        try {
            DataSource ds = createDataSource();
            con = ds.getConnection();
            
            pstmt = con.prepareStatement(sql);
            
            //set query parameters
            if (sql.contains("?") && primaryKey != null && !primaryKey.isEmpty()) {
                pstmt.setObject(1, primaryKey);
            }
            
            rs = pstmt.executeQuery();
            ResultSetMetaData rsmd = rs.getMetaData();
            int columnsNumber = rsmd.getColumnCount();
            
            // Set retrieved result to Form Row Set
            while (rs.next()) {
                FormRow row = new FormRow();
                
                //get the name of each column as field id 
                for (int i = 1; i <= columnsNumber; i++) {
                    String name = rsmd.getColumnName(i);
                    String value = rs.getString(name);
                    
                    if (FormUtil.PROPERTY_ID.equals(name)) {
                        row.setId(value);
                    } else {
                        row.setProperty(name, (value != null)?value:"");
                    }
                }
                
                rows.add(row);
            }
        } catch (Exception e) {
            LogUtil.error(getClassName(), e, "");
        } finally {
            try {
                if (rs != null) {
                    rs.close();
                }
                if (pstmt != null) {
                    pstmt.close();
                }
                if (con != null) {
                    con.close();
                }
            } catch (Exception e) {
                LogUtil.error(getClassName(), e, "");
            }
        }
        
        return rows;
    }
    
    /**
     * To creates data source based on setting
     * @return
     * @throws Exception 
     */
    protected DataSource createDataSource() throws Exception {
        DataSource ds = null;
        String datasource = getPropertyString("jdbcDatasource");
        if ("default".equals(datasource)) {
            // use current datasource
             ds = (DataSource)AppUtil.getApplicationContext().getBean("setupDataSource");
        } else {
            // use custom datasource
            Properties dsProps = new Properties();
            dsProps.put("driverClassName", getPropertyString("jdbcDriver"));
            dsProps.put("url", getPropertyString("jdbcUrl"));
            dsProps.put("username", getPropertyString("jdbcUser"));
            dsProps.put("password", getPropertyString("jdbcPassword"));
            ds = BasicDataSourceFactory.createDataSource(dsProps);
        }
        return ds;
    }

c.

Manage the

สร้าง dependency libraries

of your plugin

ของปลั๊กอินของคุณ

ปลั๊กอินของเราใช้ Our plugin is using dbcp, javax.servlet.http.HttpServletRequest and javaxและคลาส javax.servlet.http.HttpServletResponse class, so we will need to add jsp. ดังนั้นเราต้องเพิ่ม jsp-api and และ commons-dbcp library to our ในไฟล์ POM file.ของเรา

Code Block
languagexml
<!-- Change plugin specific dependencies here -->
<dependency>
    <groupId>javax.servlet</groupId>
    <artifactId>jsp-api</artifactId>
    <version>2.0</version>
</dependency>
<dependency>
    <groupId>commons-dbcp</groupId>
    <artifactId>commons-dbcp</artifactId>
    <version>1.3</version>
</dependency>
<!-- End change plugin specific dependencies here -->

d.

Make your plugin

สร้างปลั๊กอิน internationalization (i18n)

ready

ของคุณให้พร้อม

We are using เราใช้ i18n message key in ในการ getLabel and และ getDescription method. We also used i18n message key in our properties options definition as well. So, we will need to create a และเรายังใช้ i18n message key ใน properties options definition ของเราด้วยเหมือนกัน ดังนั้นเราต้องสร้างไฟล์ message resource bundle properties file for our plugin.สำหรับปลั๊กอินของเรา

สร้าง Create directory "resources/messages" under ภายใต้ "jdbc_load_binder/src/main" directory. Then, create a จากนั้นสร้างไฟล์ "JdbcLoadBinder.properties" file in the folder. In the properties file, let add all the message keys and its label as below.ในโฟลเดอร์. ในไฟล์คุณสมบัติเราต้องเพิ่ม message keys และ label ดังต่อไปนี้

Code Block
org.joget.tutorial.JdbcLoadBinder.pluginLabel=JDBC Binder
org.joget.tutorial.JdbcLoadBinder.pluginDesc=Used to load form data using JDBC
form.jdbcLoadBinder.config=Configure JDBC Binder
form.jdbcLoadBinder.datasource=Datasource
form.jdbcLoadBinder.customDatasource=Custom Datasource
form.jdbcLoadBinder.defaultDatasource=Default Datasource
form.jdbcLoadBinder.driver=Custom JDBC Driver
form.jdbcLoadBinder.driver.desc=Eg. com.mysql.jdbc.Driver (MySQL), oracle.jdbc.driver.OracleDriver (Oracle), com.microsoft.sqlserver.jdbc.SQLServerDriver (Microsoft SQL Server)
form.jdbcLoadBinder.url=Custom JDBC URL
form.jdbcLoadBinder.username=Custom JDBC Username
form.jdbcLoadBinder.password=Custom JDBC Password
form.jdbcLoadBinder.sql=SQL SELECT Query
form.jdbcLoadBinder.sql.desc=Use question mark (?) in your query to represent primary key or foreign key
form.jdbcLoadBinder.testConnection=Test Connection
form.jdbcLoadBinder.connectionOk=Database connected
form.jdbcLoadBinder.connectionFail=Not able to establish connection.

e.

Register your plugin to

ลงทะเบียนปลั๊กอินของคุณที่ Felix Framework

We will have to register our plugin class in Activator class (Auto generated in the same class package) to tell Felix Framework that this is a plugin.เราจะต้องลงทะเบียนคลาสปลั๊กอินของเราในคลาส Activator (สร้างอัตโนมัติในแพ็คเกจคลาสเดียวกัน) เพื่อบอก Felix Framework ว่านี่คือปลั๊กอิน
Code Block
languagejava
    public void start(BundleContext context) {
        registrationList = new ArrayList<ServiceRegistration>();
        //Register plugin here
        registrationList.add(context.registerService(JdbcLoadBinder.class.getName(), new JdbcLoadBinder(), null));
    } 

f.

Build it and testing

สร้างและทดสอบ

สร้างปลั๊กอินของเรา เมื่อสร้างสำเร็จเราจะพบว่าไฟล์ Let build our plugin. Once the building process is done, we will found a "jdbc_load_binder-5.0.0.jar" file is created under อยู่ภายใต้ "jdbc_load_binder/target" directory.

Then, let upload the plugin jar to จากนั้นให้เราอัพโหลดปลั๊กอิน Manage Plugins.  After upload the jar file, double check the plugin is uploaded and activated correctly.หลังจากอัพโหลดไฟล์ jar ให้ตรวจสอบอีกครั้งว่าปลั๊กอินอัพโหลดถูกต้อง

Let create a form to load firstName, lastName and email from dir_user table based on username to test the load binder.

Image Removed

ให้สร้างแบบฟอร์มเพื่อโหลด "firstName", "lastName" และ "email" จากตาราง dir_user ตามชื่อผู้ใช้เพื่อทดสอบการโหลด

Image Added

จากนั้นกำหนดค่า load binder ของฟอร์มเพื่อใช้ JDBC Binder และ query ต่อไปนี้Then, configure the load binder of the form to use JDBC Binder with the following query.

Code Block
languagesql
 select * from dir_user where username = ?

Let create an userview and drag a Form Menu element to display our form. Then, publish it and test our form with an "id" parameter.

Image Removed

ให้สร้าง userview และลากองค์ประกอบเมนูแบบฟอร์มเพื่อแสดงแบบฟอร์มของเรา จากนั้นเผยแพร่และทดสอบแบบฟอร์มของเราด้วยพารามิเตอร์ "id"Image Added

จากนั้นให้เพิ่มองค์ประกอบตารางและ  query เพื่อทดสอบดังต่อไปนี้Next, let add a grid element and test with the following query.

Code Block
languagesql
select * from dir_group g 
join dir_user_group ug on ug.groupId = g.id
where ug.userId = ?

Let check our result again.ตรวจสอบผลลัพธ์ของเราอีกครั้ง

It works! Please remember test the other features of the plugin as well. มันได้ผล! โปรดอย่าลืมทดสอบคุณสมบัติอื่น ๆ ของปลั๊กอินด้วย (big grin)

8.

...

ขั้นต่อไป แชร์หรือขาย

คูรสามารถดาวน์โหลหด source code จาก You can download the source code from jdbc_load_binder_src.zip.

To download the ready-to-use plugin jar, please find it in หากต้องการดาวน์โหลด jar ปลั๊กอินที่พร้อมใช้งานโปรดค้นหาได้ที่ http://marketplace.joget.org/.

...