CN101714080A - 实现web多语言控件的方法及系统 - Google Patents

Abstract

本发明涉及web技术领域，公开了一种实现web多语言控件的方法，所述方法包括：建立控件的服务器模型，并将所述控件绑定为多语言属性；在加载页面时，获取所述控件的基本属性值，并从所述控件绑定的多语言属性中获取当前的语言属性值；根据所述控件的服务器模型、所述控件的基本属性值和当前的语言属性值将所述控件渲染到所述页面。本发明能够在web界面上支持多语言输入，方便不同语言用户的使用。

Description

实现web多语言控件的方法及系统

技术领域

本发明涉及web技术领域，具体涉及一种实现web多语言控件的方法及系统。

背景技术

Internet技术的成熟为企业信息管理系统增加了与客户或供应商实现信息共享和直接的数据交换的能力，从而强化了企业间的联系，形成共同发展的生存链。ERP(Enterprise Resource Planning，企业资源计划)系统就是为了满足这种需求应运而生的一种对企业资源进行有效共享与利用的系统，其主要宗旨是将企业的各方面资源(比如人力、资金、信息、物料、设备、时间、技术等)充分调配、平衡和优化，为企业提高资金运营水平、建立高效率供销链、减少库存、提高生产效率、降低成本、提高客户服务水平提供强有力的工具，同时为高层管理人员经营决策提供科学的依据，有效地提高盈利，最终全面建立企业竞争优势，提高企业的市场竞争力。

目前，ERP系统需要国际化，很多业务单据的某些中文字段需要在不同的语言环境下显示不同的内容。由于ERP软件的架构是基于web模式，或者Client/Server(客户端/服务器)模式。对于基于web模式的ERP软件，要求web界面能够支持输入多语言文本。

在现有技术中，只有Java的GUI(Graphic User Interface，图形用户接口)中有多语言控件，其采用AWT(Abstract Window Toolkit，抽象窗口工具集)使GUI适用于不同操作系统的环境，具体实现由目标平台下的操作系统来解释，从而使Java GUI在不同平台下会出现不同的运行效果(窗口外观、字体等的显示效果会发生变化)。GUI的控件是基于Client/Server的，其交互方式和应用方式和web是完全不同的，因此无法将这种方式移植到基于web模式的应用系统中。

发明内容

本发明实施例提供一种实现web多语言控件的方法及系统，能够在web界面上支持多语言输入，方便不同语言用户的使用。

本发明实施例提供的一种实现web多语言控件的方法，包括：

建立控件的服务器模型，并将所述控件绑定为多语言属性；

在加载页面时，获取所述控件的基本属性值，并从所述控件绑定的多语言属性中获取当前的所有语言属性值；

根据所述控件的服务器模型、所述控件的基本属性值和当前的所有语言属性值将所述控件渲染到所述页面。

优选地，所述控件的基本属性值包括以下属性的值：控件样式、控件大小。

优选地，所述方法还包括：

在所述页面上修改或添加或删除所述控件当前的语言属性值；

在提交页面时，将修改或添加或删除后的语言属性值保存到所述控件的服务器模型中。

可选地，所述在页面上修改或添加或删除所述控件当前的语言属性值包括：

在所述页面中设置第一用户接口；

通过所述第一用户接口在所述页面中修改或添加或删除所述控件当前的语言属性值。

可选地，所述在页面上添加所述控件当前的语言属性值包括：

在所述页面中设置第二用户接口；

通过所述第二用户接口获取需要翻译的对象及类型；

将所述对象及类型发送给服务器，以使服务器将所述对象翻译为所述类型对应的形式；

根据服务器返回的值，添加所述控件当前的语言属性值。

本发明实施例提供的一种实现web多语言控件的系统，包括：

模型建立单元，用于建立控件的服务器模型，并将所述控件绑定为多语言属性；

属性获取单元，用于在加载页面时，获取所述控件的基本属性值，并从所述控件绑定的多语言属性中获取当前的所有语言属性值；

渲染单元，用于根据所述控件的服务器模型、所述控件的基本属性值和当前的所有语言属性值将所述控件渲染到所述页面。

优选地，所述系统还包括：

修改单元，用于在所述页面上修改或添加或删除所述控件当前的语言属性值；

保存单元，用于在提交页面时，将修改或添加或删除后的语言属性值保存到所述控件的服务器模型中。

可选地，所述系统还包括：

第一用户接口，用于接收用户输入的所述控件当前的语言属性值；

所述修改单元，具体用于根据所述第一用户接口接收的所述控件当前的语言属性值，在所述页面中修改或添加或删除所述控件当前的语言属性值。

可选地，所述系统还包括：

第二用户接口，用于接收用户输入的翻译命令，所述命令中包含需要翻译的对象及类型；

发送单元，用于将所述对象及类型发送给服务器，以使服务器将所述对象翻译为所述类型对应的形式；

接收单元，用于接收服务器返回的值；

所述修改单元，具体用于根据所述服务器返回的值，添加所述控件当前的语言属性值。

优选地，所述第二用户接口，具体为显示于所述页面的控件按钮。

本发明实施例提供的实现web多语言控件的方法及系统，通过建立控件的服务器模型，并将所述控件绑定为多语言属性；在加载页面时，获取所述控件的基本属性值，并从所述控件绑定的多语言属性中获取当前的语言属性值；根据所述控件的服务器模型、所述控件的基本属性值和当前的语言属性值将所述控件渲染到所述页面。从而可以实现多语言控件的输入值和后台一个属性的多个值的绑定，使用户在web界面上进行多语言文本输入的支持。

附图说明

图1是本发明实施例实现web多语言控件的方法的流程图；

图2是本发明实施例基于Java编程实现的类图；

图3是本发明实施例中用户接口的结构示意图；

图4是本发明实施例实现web多语言控件的系统的结构示意图；

图5是本发明实施例实现web多语言控件的系统的一种具体结构示意图；

图6是本发明实施例实现web多语言控件的系统的另一种具体结构示意图。

具体实施方式

为了使本技术领域的人员更好地理解本发明实施例的方案，下面结合附图和实施方式对本发明实施例作进一步的详细说明。

如图1所示，是本发明实施例实现web多语言控件的方法的流程图，包括以下步骤：

步骤101，建立控件的服务器模型，并将所述控件绑定为多语言属性。

在本发明实施例中，所述控件绑定到服务器模型的多语言属性，多语言属性一般有多个值，所述控件的服务器模型记录该控件的语言属性值。

步骤102，在加载页面时，获取所述控件的基本属性值，并从所述控件绑定的多语言属性中获取当前的所有语言属性值。

所述控件的基本属性值包括以下属性的值：控件样式、控件大小。

步骤103，根据所述控件的服务器模型、所述控件的基本属性值和当前的所有语言属性值将所述控件渲染到所述页面。

假设在实际应用于，基于Java编程实现本发明实施例的方法，则实现的类图如图2所示：

其中，waf.taglib.xml是控件的配置文件，用于设置控件的多语言属性，waf.taglib.xml包含控件的详细类名，需要统一加载；

UIMultiLangBoxBase是控件的基类，定义控件的一些基本属性值，在其实现类UIMultiLangBox中设置了setValue方法和getValue方法，用于对所述控件提交的值进行处理。setValue获取到页面上控件的多语言属性值后，解析这个值，然后反射调用模型对应属性的set方法，将每个语言的值都设置到模型中。由于需要将所述控件展现成EXT中类似多语言的效果，因此可以在上述步骤输出对应的客户端js和html代码。

MultiLangBoxRenderHandle是整个控件的核心，处理控件的页面展示，其主要包含以下几个方法：

resourceBegin：处理控件需要加载的资源，在此为资源文件multiLangBox.js。

multiLangBox.js：是所述控件的EXTJS实现，在制作WAF控件前，需要事先用EXTJS的实现方式实现一种效果，MultiLangBoxRenderHandle的作用只是把这些内容输出为对应的js和html标签而已。ExtJS是可以用来开发RIA也即富客户端的AJAX应用，是用javascript编写的，主要用于创建前端用户界面，是一个与后台技术无关的前端ajax框架。可以将ExtJS用在.Net、Java、Php等各种开发语言开发的应用中。

当然，本发明实施例实现web多语言控件的方法并不仅限于上述基本Java编程实现，还可以采用其他编程方式实现。

可见，本发明实施例实现web多语言控件的方法可以实现控件的多语言属性与后台的多个值的绑定，使用户在web界面上进行多语言文本输入的支持。

在本发明实施例中，为了方便用户的使用，在上述流程中，还可进一步包括以下步骤：

在所述页面上修改或添加或删除所述控件当前的语言属性值；

在提交页面时，将修改或添加或删除后的语言属性值保存到所述控件的服务器模型中。

具体地，对所述控件当前的语言属性值的修改或添加可以通过多种方式来实现，下面分别作详细说明。

方式一、由用户直接在页面上修改或添加或删除所述控件当前的语言属性值。

可以在所述页面中设置第一用户接口，通过所述第一用户接口在所述页面中修改或添加或删除所述控件当前的语言属性值。

方式二、通过服务器提供的翻译功能添加所述控件当前的语言属性值。

同样，可以在所述页面中设置第二用户接口，通过所述第二用户接口获取需要翻译的对象及类型；将所述对象及类型发送给服务器，以使服务器将所述对象翻译为所述类型对应的形式；根据服务器返回的值，修改或添加所述控件当前的语言属性值。

需要说明的是，上面提到的第一用户接口和第二用户接口可以为同一个接口，也可以分别是不同的接口。下面以采用同一个用户接口为例举例说明。

如图3所示，本发明实施例中用户接口的结构示意图。

当用户需要在页面上修改或添加或删除所述控件当前的语言属性值时，点击右边的“CH”图标，页面上显示出图3所示的下拉框，在该实施例中，假设该控件绑定了两个语言属性值，分别为简体中文和繁体中文，相应地，下拉框中显示两行属性值，分别为“CH”(对应简体中文)和“TW”(对应繁体中文)。点击其中的“TW”，然后在上面的显示框中输入相应的繁体中文“中國”。当页面提交时，该繁体中文对应的语言属性值则被保存到所述控件的服务器模型中。当然，可以按照上述方式对原有的属性值进行修改或删除，如果删除原有属性值，则在页面提交时，可以将对应的属性值设置为空。

如果需要借助服务器提供的翻译功能添加所述控件当前的语言属性值，可以通过以下操作完成。

首先，在用户输入一种语言的属性值后，比如输入简体的“中国”，然后点击右边的“CH”图标，触发控件的onTriggerClick事件，这个时候控件通过ajax技术将控件当前的属性值和要转换的类型发送到服务器，示例代码如下：

pcAjax＝Ext.lib.Ajax.getConnectionObject().conn；

pcAjax.open(″GET″，″/easweb/winlet/multilang/MultiLangAjax.jsf？type＝ctt&str＝″+encodeURIComponent(encodeURIComponent(this.getRawValue()))，false)；

pcAjax.setRequestHeader(″Content-Type″，″application/x-www-form-urlencoded″)；

pcAjax.send()；///发送ajax请求；

tr.set(′value′，pcAjax.responseText)；//获取服务器的响应值，更新控件的语言属性值

tr.set(′text′，pcAjax.responseText)；

服务器接收到所述控件当前的属性值和要转换的类型后，对该控件的属性值进行翻译，并将翻译结果返回给客户端。客户端获取翻译后的值，更新控件显示内容，此时，如果用户点击右边的“CH”图标，页面显示多语言下拉框，而且，繁体的“中國”将显示在“TW”的下拉框中。

当然，本发明实施例的方法可以同时提供上述两种功能，既可以由用户在页面上修改或添加或删除所述控件当前的语言属性值，也同时可以借助服务器提供的翻译功能添加所述控件当前的语言属性值。

可见，本发明实施例实现web多语言控件的方法，不仅可以实现控件的多语言属性与后台的多个值的绑定，使用户在web界面上进行多语言文本输入的支持，而且使用灵活、方便。

本发明实施例实现web多语言控件的方法，可以应用于多种业务系统的开发中，使其中某些中文字段需要在不同的语言环境下显示不同的内容。

本领域普通技术人员可以理解实现上述实施例方法中的全部或部分步骤是可以通过程序来指令相关的硬件来完成，所述的程序可以存储于一计算机可读取存储介质中，所述的存储介质，如：ROM/RAM、磁碟、光盘等。

本发明实施例还提供一种实现web多语言控件的系统，如图5所示，是该系统的结构示意图。

在该实施例中，所述系统包括：

模型建立单元401，用于建立控件的服务器模型，并将所述控件绑定为多语言属性；

属性获取单元402，用于在加载页面时，获取所述控件的基本属性值，并从所述控件绑定的多语言属性中获取当前的语言属性值；

渲染单元403，用于根据所述控件的服务器模型、所述控件的基本属性值和当前的语言属性值将所述控件渲染到所述页面。

本发明实施例实现web多语言控件的系统，可以实现控件的多语言属性与后台的多个值的绑定，使用户在web界面上进行多语言文本输入的支持。

为了方便用户的使用，在本发明实施例的系统中，还可进一步包括：

修改单元404，用于在所述页面上修改或添加或删除所述控件当前的语言属性值。

保存单元405，用于在提交页面时，将修改或添加或删除后的语言属性值保存到所述控件的服务器模型中。

在本发明实施例中，所述修改单元404可以通过多种方式对所述控件当前的语言属性值进行修改或添加或删除。

如图5所示，是本发明实施例实现web多语言控件的系统的一种具体结构示意图。

与图4所示实施例不同的是，在该实施例中，所述系统还进一步包括：

第一用户接口501，用于接收用户输入的所述控件当前的语言属性值。

在该实施例中，所述修改单元404具体用于根据所述第一用户接口601接收的所述控件当前的语言属性值，在所述页面中修改或添加或删除所述控件当前的语言属性值。具体可参照前面本发明实施例web多语言控件的方法中的描述。

如图6所示，是本发明实施例实现web多语言控件的系统的另一种具体结构示意图。

与图4所示实施例不同的是，在该实施例中，所述系统还进一步包括：

第二用户接口601，用于接收用户输入的翻译命令，所述命令中包含需要翻译的对象及类型；所述第二用户接口601具体可以为显示于所述页面的控件按钮；

发送单元602，用于将所述对象及类型发送给服务器，以使服务器将所述对象翻译为所述类型对应的形式；

接收单元603，用于接收服务器返回的值；

在该实施例中，所述修改单元404具体用于根据所述服务器返回的值，修改或添加所述控件当前的语言属性值。

需要说明的是，上面提到的第一用户接口501和第二用户接口601可以为同一个接口，也可以分别是不同的接口。而且，在本发明实施例中，所述实现web多语言控件的系统可以同时提供上述图5和6所示实施例所具有的功能。

可见，本发明实施例实现web多语言控件的系统，不仅可以实现控件的多语言属性与后台的多个值的绑定，使用户在web界面上进行多语言文本输入的支持，而且使用灵活、方便。

以上对本发明实施例进行了详细介绍，本文中应用了具体实施方式对本发明进行了阐述，以上实施例的说明只是用于帮助理解本发明的方法及设备；同时，对于本领域的一般技术人员，依据本发明的思想，在具体实施方式及应用范围上均会有改变之处，综上所述，本说明书内容不应理解为对本发明的限制。

Claims (10)

1.一种实现web多语言控件的方法，其特征在于，包括：

建立控件的服务器模型，并将所述控件绑定为多语言属性；

在加载页面时，获取所述控件的基本属性值，并从所述控件绑定的多语言属性中获取当前的所有语言属性值；

根据所述控件的服务器模型、所述控件的基本属性值和当前的所有语言属性值将所述控件渲染到所述页面。

2.根据权利要求1所述的方法，其特征在于，所述控件的基本属性值包括以下属性的值：控件样式、控件大小。

3.根据权利要求1所述的方法，其特征在于，所述方法还包括：

在所述页面上修改或添加或删除所述控件当前的语言属性值；

在提交页面时，将修改或添加或删除后的语言属性值保存到所述控件的服务器模型中。

4.根据权利要求3所述的方法，其特征在于，所述在页面上修改或添加或删除所述控件当前的语言属性值包括：

在所述页面中设置第一用户接口；

通过所述第一用户接口在所述页面中修改或添加或删除所述控件当前的语言属性值。

5.根据权利要求3所述的方法，其特征在于，所述在页面上添加所述控件当前的语言属性值包括：

在所述页面中设置第二用户接口；

通过所述第二用户接口获取需要翻译的对象及类型；

将所述对象及类型发送给服务器，以使服务器将所述对象翻译为所述类型对应的形式；

根据服务器返回的值，添加所述控件当前的语言属性值。

6.一种实现web多语言控件的系统，其特征在于，包括：

模型建立单元，用于建立控件的服务器模型，并将所述控件绑定为多语言属性；

属性获取单元，用于在加载页面时，获取所述控件的基本属性值，并从所述控件绑定的多语言属性中获取当前的所有语言属性值；

渲染单元，用于根据所述控件的服务器模型、所述控件的基本属性值和当前的所有语言属性值将所述控件渲染到所述页面。

7.根据权利要求6所述的系统，其特征在于，所述系统还包括：

修改单元，用于在所述页面上修改或添加或删除所述控件当前的语言属性值；

保存单元，用于在提交页面时，将修改或添加或删除后的语言属性值保存到所述控件的服务器模型中。

8.根据权利要求7所述的系统，其特征在于，所述系统还包括：

第一用户接口，用于接收用户输入的所述控件当前的语言属性值；

所述修改单元，具体用于根据所述第一用户接口接收的所述控件当前的语言属性值，在所述页面中修改或添加或删除所述控件当前的语言属性值。

9.根据权利要求7所述的系统，其特征在于，所述系统还包括：

第二用户接口，用于接收用户输入的翻译命令，所述命令中包含需要翻译的对象及类型；

发送单元，用于将所述对象及类型发送给服务器，以使服务器将所述对象翻译为所述类型对应的形式；

接收单元，用于接收服务器返回的值；

所述修改单元，具体用于根据所述服务器返回的值，添加所述控件当前的语言属性值。

10.根据权利要求9所述的系统，其特征在于，

所述第二用户接口，具体为显示于所述页面的控件按钮。

Images