Mendix一练一动: Mendix Studio Pro连接外围数据库（SQL Server）实现增删改查

一、 环境准备

1： 连接外围数据库是Mendix的内置功能，不同数据库的连接方式都大同小异，本文以SQL Server为例讲解；

2：本文假设读者是Mendix初级学者，因此对每一步骤作者都尽量表述详尽，熟练学者可1.5倍速阅读。

3：安装清单：

• Mendix Marketplace - Studio Pro Download （建议安装次新版本）
• SQL Server 下载 | Microsoft： Developer版
• 下载 SQL Server Management Studio (SSMS) - SQL Server Management Studio (SSMS) | Microsoft Docs

二、 下载Database Connector及相关配置

假设你已经安装了Mendix Studio Pro并建好了你的项目，在Studio Pro的右上角点击图标（App Store）进入App Store界面（内嵌在Mendix Studio Pro工作区当中）。

在左边目录中选择 Connectors->Data或者直接在搜索框输入 Database, 找到“Database Connector”，点开：

首先点击“Download”按钮下载，默认选择“Add as a new module”将其作为新的组件添加到项目中。

导入后，你可以在项目路径 App Store modules下找到它。

然后，在App Store里点击Document页签下的Database Connector链接，在网页中打开参考文档，查看具体使用信息及注意事项。值得注意的是前提条件的部分：

你需要下载相关的JDBC driver/驱动文件，并解压放到Mendix项目的userlib目录下，然后在Mendix项目中定义数据库连接常量的时候需要将对应的路径信息维护上（下文会讲到），如果你选择的数据库是PostgreSQL就参照这里给的例子。我们的数据库是SQL Server，因此我们点击链接Common JDBC Drivers跳转到下文JDBC Drivers部分来下载我们需要的驱动。

选择我们要的SQL Server数据库，就会到了我们需要下载Driver的地址（https://www.microsoft.com/en-us/download/details.aspx?id=11774），下载即可。

可自选保存在临时的目录下，解压，解压后到目录jre8下（比如~\Microsoft JDBC Driver 6.0 for SQL Server\sqljdbc_6.0\enu\jre8）将.jar （我这里是sqljdbc42.jar）文件拷贝到项目的userlib(我这里是C:\Users\xxx\Documents\Mendix\MyLaunchPad\userlib)目录下。

至此，Mendix Studio Pro里的数据库连接器下载安装工作完成。

 

三、 数据库中的准备工作

下面我们进到数据库，做一些数据准备工作，包括：建数库，建表和建用户。

当然，首先你要构思好你需要进行操作的数据模型，比如我这里的设计是维护一张服务成本表（Service Cost Rate）。

打开你的数据库管理器，我这里是SQL Server Management Studio。

1. 新建数据库

姑且命名为ExternalDB，保存。

2. 建数据表

根据设计好的表结构建字段及属性。

我的参考信息：

Table: CostRates

CostRateID  (主键)	int
CostDescription	nvarchar(500)
CompanyID	nvarchar(50)
ValidTo	nvarchar(50)
CostRate	decimal(18, 2)

3. 建用户

定义数据库访问用户。在SSMS中，访问路径 Security->Login，右键->New Login (不同数据库的位置可能略有差别，总之是定义一个数据库的访问用户)。

• 命名为：MXadmin
• 密码：mendix

将用户设置成为数据库Owner：双击左边的User Mapping, 选中你的数据库“ExternalDB”, 右下角的数据库角色里勾选 db_owner，保存。

这时可以看到该用户已经建成：

四、 Mendix Studio Pro中建数据模型与数据库连接常量

1. 数据模型/Data Model

同样的数据模型，我们在Mendix中也建一遍，数据类型保持一致。

 

2. 创建数据库访问常量

• URL:  右键MyFirstModule -> Add other -> Constant:

• 命名：DB_URL
• 类型：String
• 默认值：jdbc:sqlserver://localhost;database=ExternalDB;

回到Mendix Studio Pro，继续建两个常量：

DB_USER:

DB_PASS:

至此，访问本地数据库的准备工作已经就位，下面就开始开发你的应用，实现对数据库的增删改查了。

 

五、 实现增删改查

1. 应用框架设计

简单描述一下本文所演示的应用页面的主体设计思路。首先应用采用SAP模板，入口为My Launchpad（我的工作面板），点击我的面板中的第一个应用 “成本维护”将跳转至成本维护的概览界面，在这里我们完成增删改查的动作。页面链接部分这里不做赘述，在对应链接属性中配置On Click的响应为“Show a Page”，然后选择默认的List控件即可。看截图：

 

2. 概览页面数据初始化填充

新建的页面命名为CostRateOverview，用于展示成本的概览信息，并提供增删改查入口。

2.1 调整CostRateOverview页面布局

调整CostRateOverview页面布局，删除不需要的控件。

修改页面抬头和描述；

修改现有字段，属性，将需要展示的信息按顺序排列在页面上： CostDescription, CompanyID, ValidTo, CostRate.

在参数的位置，点击“New”，选择CostDescription.

将参数{1} 添加到字段描述中。

同样的方法修改其他属性字段。

同时确保暂时无事件响应的按钮，其属性中 On Click 响应的值选为Do Nothing.

2.2 数据填充微流设计

选中List控件，从右边的工具框Connector页签下将定义好的Data Entity “CostRates”拖拽到List控件。

弹窗选择通过Microflow/微流的方式来填充数据，勾选掉“Automatically fill the content of the list view”，我们暂时选择手动添加属性字段并通过微流填充数据。

双击左边导航栏中微流名称“Show_CostOverview”进入微流编辑工作区。现在我们来实现从数据库查询CostRates表信息并填入刚才定义的页面的ListView组件中。

如同我们写代码之前需要构思函数架构一样，我们在设计微流之前先要想好它要帮我们干什么：

从指定的数据库ExternalDB读取CostRates表信息并填入刚才定义的CostRateOverview页面的ListView控件中；

<- 而“填入xx控件”这个动作是不是已经通过属性配置/关联好了，那么我的任务描述是不是就可以简化成：

<-从指定的数据库ExternalDB读取CostRates表信息，这里面还蕴含一个内置逻辑（输出的结构必须跟Listview中接收的结构一致是不是，不难想象，这里是DataEntity: CostRates）, 于是我就有了我的函数设计：

<-

输入：

数据库访问URL（我已经定义好的常量DB_URL）；

数据库访问用户（DB_USER）;

数据库访问密码（DB_PASS）;

输出：一个DataEntity: CostRates 类型的结构/表（这个参数我好像还没定义吧，没关系，往下看）；

好，我们来实现微流：

<- 

1. 定义一个DataEntity: CostRates类型的参数传进微流函数，接收查询出来的数据：

微流编辑区提供了非常方便的快捷Action Activity，点一下，在要放置的目的地再点一下，就好了，这里我们来定义一个；

双击Activity，选择Action类型，这里我们要定义一个Object参数，因此选择Create Object.

直接可以选择定义好的Entity 关联进来，非常方便（Select->在弹框里选择你的Entity）。

取个名字方便区分，比如：CostRate_Obj.

这样输出参数就定义好了，可以执行查询函数了。

2. 定义数据库查询

Mendix Studio Pro的 Toolbox给我们提供了很多可以直接拖拽使用的Action，比如我们将要使用到的“Execute Query”, 选中直接拖拽至工作区。

双击Execute Query这个Activity，在弹框里按照之前的设计填入参数即可，像极了我们平时写函数，对不对。

点击每个参数输入区域后面的按钮“Edit”, 按照这个语法格式选择参数即可。

选择常量的时候，只要输入个@字符即可联想出已定义好的常量，支持模糊查找。

按照这种方式，定义好输入参数“Jdbc url”, “User name”, “User password”。

Sql的部分，我们要编辑SQL查询语句来查询数据表信息，格式如下：

'Select CostRateID CostDescription, CompanyID, ValidTo, CostRate from CostRates'

【备注】CostRateID暂时不用显示在界面上，但需要取出，后续进行数据库操作时使用；

Result Object选择刚定义的参数$CostRate_Obj.

输出端：

List name: ListofCostRate (在微流的终端时候使用，作为整个微流的输出)

3. 设置输出格式

在微流的终点，双击，选择输出类型为List，值为刚才定义的List Name $ListofCostRate。

这样微流定义完毕了。

2.3 试运行

点击Run Locally编译试运行 。

点击View进入应用界面。

点击成本维护，查看服务成本Overview界面，因为数据表目前为空，因此没有数据展示。

数据库表添加信息：

添加信息之后再次运行：

 

3. 添加

页面设计：

- 增加的按钮在主页面的右上角

- 新建一条成本记录需要填写一个新的表单，因此需要一个新的Page

- 新建的时候输入的信息包括：成本描述/ CostDescription，公司ID/ CompanyID, 截至时间/ValidTo, 价格/CostRate.

- 输入完成后应该有保存按钮

- 保存成功应该有弹窗提示

- 放弃新建应该有Cancel按钮，并返回上一页面

根据上述设计进行分解实现：

 

 

新建页面CostRateNew

 

Save按钮响应事件 Call a microflow,新建一个微流

 

 实现微流CostRate_InsertUpdate，向数据库插入页面CostRateNew上输入的信息：

定义写数据库的需要用到的参数，以CostRateID为例：

同样方式定义其他参数，完成后如下：

添加一条记录对应就是向数据库插入一条数据，因此下一步我们要执行SQL语句向数据库插入一条记录，插入的值为当前页面上的输入值（上述定义的参数获取）。在Toolbox里找到Execute Statement的动作，拖拽至工作区。

完成之后关闭当前页面，因此我们要在后面加一个Action：Close Page。

同时为了用户友好，我们弹框提示信息已保存，信息中可以引用参数CostRateDescription表明是该条记录已保存，这个Activity叫“Show Message”。

运行程序，验证添加按钮

到数据库中验证记录添加成功:

通过对上述过程尤其是“添加”按钮的详细的介绍之后，我们基本覆盖了Mendix Studio Pro 快速开发的基础操作，因此后续的功能实现我们会介绍基本逻辑总览界面，不再赘述了，如有问题可以后续在讨论。

 

4. 编辑/修改

编辑/修改的界面设计：

- “编辑”按钮位于每一条成本记录的左下角

- 点击“编辑”按钮后进入新的编辑界面，界面应该跟新建一条记录的界面相似，不同的是新建界面中各属性字段为空，编辑时各属性字段为被编辑的值

- 可编辑的信息包括：成本描述/ CostDescription，公司ID/ CompanyID, 截至时间/ValidTo, 价格/CostRate.

- 输入完成后应该有保存按钮

- 保存成功应该有弹窗提示：某条记录已修改

- 放弃修改应该有Cancel按钮，并返回上一页面

根据上述设计进行分解实现：

点击Edit按钮之后实现一个微流来调出编辑（新建）页面并将当前值填充到页面上。

响应Edit事件的微流主要做两件事情，第一按照CostRateID去数据库读取当前的数据，第二是调出页面CostRateNew并将上一步读出的数据放到页面里供编辑。

'Select * from CostRates where CostRateID = '+ $CostRates/CostRateID+';'

在点击Save按钮的时候，微流CostRate_InsertUpdate会被调用，之前在添加的时候我们已经实现了这个微流，这里要对实现的逻辑做一些修改，使得它也能满足Edit的需求：

- 如果Cost已经存在则Edit，否则新建/添加

- 在Edit这条线上：执行SQL Update语句进行Update

- Close Page

- 弹框提示修改成功

- 回到主流程

因此实现后的微流（核心部分）如下，并配有详细信息参考：

判断条件：

Update所用的SQL语句：

保存并运行：

  

 

5. 删除

删除操作没有界面设计，逻辑相对简单：

- 点击删除按钮，调用微流

- 对应数据库条目删除

- 刷新页面

按钮属性:

微流定义：

 

6. 查询

查询界面设计：

- 查询按钮在设置在页面的右上方，“添加”按钮旁边

- 点击查询按钮会弹出查询输入界面，界面中包含一个输入框，一个查询按钮，一个取消返回按钮

- 输入信息有格式要求（时间关系，这里只按ID搜索）

- 找到的信息应当在新弹出页面展示，只读，有确认关闭按钮

- 如果查不到此项，应该有弹窗提示

Data Model：

查询输入框的输入文字需要有对应Data Model设计。

 

查询按钮定义：

查询主界面定义：

 

微流定义：

 

 

 

 

 

 

Search Result界面：

 

运行与测试：

查询失败：

 

 查询成功：

 

 

 

六、 一些经验性提示

如果遇到连接错误，一般会提示检查防火墙设置，TCP/IP端口是否可用等信息，按要求查看：

• 检查防火墙设置
• 检查SQL Server配置 

---

更多信息，请访问以下链接：

Mendix官网：https://www.mendix.com/zh/

Mendix行业解决方案：https://solutions.mendix.com/

Mendix平台指南：https://www.mendix.com/evaluation-guide/

Mendix动画展示：https://www.mendix.com/demos/

Mendix公众号

谢谢阅读！

​