我要求我必须创建级联下拉列表,这意味着第二个下拉列表的值将取决于第一个下拉列表。该列表将被硬编码。
例如国家的第一次下降,根据这个值,第二次下降是与该国相对应的州;我将列出与每个国家相对应的州名单。
现在我知道如何使用list对字段应用约束,但是可以将其扩展到两个级别吗?
我还搜索过datalist,但我真的不希望这样,因为列表将成为泛客户,但是datalist将使客户特定,并且不希望客户自己创建列表。
任何帮助都将受到高度赞赏。
由于
答案 0 :(得分:2)
Alfresco没有开箱即用的级联下拉列表。 尽管如此,开发一个并不困难。
因为您的列表是硬编码的,所以有一个简单的解决方案。 生成两个下拉列表的控件。它们甚至可以只是一个隐藏的字段或空的下拉列表。如果您不熟悉Alfresco表单引擎,则可能更容易使用隐藏字段,如下例所示(share-config-custom.xml中的配置代码段):
const bg::AppSettings& bg::AppSettings::GetInstance()
{
static AppSettings instance;
return instance;
}
在share-config-custom.xml中,您还可以添加新的自定义javascript和css:
<field id="dropdown1">
<control template="/org/alfresco/components/form/controls/hidden.ftl">
<control-param name="contextProperty">dropdown1</control-param>
</control>
</field>
<field id="dropdown2">
<control template="/org/alfresco/components/form/controls/hidden.ftl">
<control-param name="contextProperty">dropdown2</control-param>
</control>
</field>
自定义javascript和css可以使用YUI找到两个控件并生成必要的下拉列表和事件侦听器。更新下拉列表时,事件侦听器将更新级联下拉列表,并且还将更新隐藏字段。表单关闭时,将发布隐藏字段的值。
更好的解决方案是使用自定义javascript来定义javascript库。然后,您可以在自定义免费标记模板中使用此javascript库而不是“/org/alfresco/components/form/controls/hidden.ftl”
您可以在
中找到hidden.ftl/webapps/share/WEB-INF/classes/alfresco/site-webscripts/org/alfresco/components/form/controls/hidden.ftl
在扩展路径中复制此ftl并修改它以使用您的自定义JavaScript。
如果列表没有硬编码,只需使用webscript生成列表并使用ajax调用从浏览器中调用它。
答案 1 :(得分:1)
与alfresco社区版5.0.d一样,您可以/应该使用aikau进行此类事情,您可以开始学习并使用基于this tutorial的aikau作为独立的aikau客户端或this tutorial用于新的自定义共享页面。
一旦你进行了页面设置(desc.xml,js和ftl),你应该有这样的东西:
自定义-page.get.desc.xml 强>
<webscript>
<shortname>Test page 1</shortname>
<family>testing</family>
<url>/custom-uri</url>
</webscript>
自定义-page.get.ftl 强>
<@processJsonModel group="share"/>
和 custom-page.get.js
model.jsonModel = {
services : [ "alfresco/services/NavigationService",
"alfresco/services/LogoutService",
// Add more services here !!!
],
widgets : [
// Add more widgets here
]
};
现在需要为小部件数组添加两个选择:
{
name : "alfresco/forms/Form",
config : {
scopeFormControls : false, // to avoid complex handling of
// pubSubScope
widgets : [ {
name : "alfresco/forms/controls/Select",
config : {
fieldId : "LEVEL_1",
label : "Level 1",
description : "Select an item from the list",
name : "level_1",
value : "1",
requirementConfig : {
initialValue : true
},
optionsConfig : {
fixed : [ {
label : "Item 1",
value : "1"
}, {
label : "Item 2",
value : "2"
}, {
label : "Item 3",
value : "3"
} ]
}
}
}, {
name : "alfresco/forms/controls/Select",
id : "LEVEL_2",
config : {
fieldId : "LEVEL_2",
label : "Level 2",
description : "Select an item from the list",
name : "level_2",
requirementConfig : {
initialValue : true
},
optionsConfig : {
fixed : [ {
label : "Item 1.1",
value : "1"
}, {
label : "Item 1.2",
value : "2"
}, {
label : "Item 1.3",
value : "3"
} ]
}
}
} ]
}
}
下一步是在第一个选择中检测更改事件,然后使用新项目刷新第二个选择的列表。为此,您需要定义新服务或扩展第二个选择的选择小部件。我将选择1号选项: 的 CustomServiceForNestedSelects.js 强>
define(
[ "dojo/_base/declare", "alfresco/core/Core", "dojo/_base/lang",
"alfresco/core/CoreXhr", "service/constants/Default" ],
function(declare, Core, lang, CoreXhr, AlfConstants) {
return declare(
[ Core, CoreXhr ],
{
pubSubScope : "",
levelOneFieldId : "LEVEL_1",
levelTwoFieldId : "LEVEL_2",
levelTwoItems : [ [ {
label : "Item 1.1",
value : "1"
}, {
label : "Item 1.2",
value : "2"
}, {
label : "Item 1.3",
value : "3"
} ], [ {
label : "Item 2.1",
value : "1"
}, {
label : "Item 2.2",
value : "2"
}, {
label : "Item 2.3",
value : "3"
} ], [ {
label : "Item 3.1",
value : "1"
}, {
label : "Item 3.2",
value : "2"
}, {
label : "Item 3.3",
value : "3"
} ] ],
constructor : function yreg_CustomServiceForNestedSelects__constructor(
args) {
lang.mixin(this, args);
this.alfSubscribe(this.pubSubScope
+ "_valueChangeOf_" + this.levelOneFieldId,
lang.hitch(this, this.levelOneChanged));
},
levelOneChanged : function yreg_CustomServiceForNestedSelects__levelOneChanged(
payload) {
var value = payload.value;
var levelTwo = dijit.byId(this.levelTwoFieldId);
if (levelTwo)
levelTwo
.setOptions(this.levelTwoItems[value - 1]);
},
});
});
现在,剩下的就是将您的服务包含在您的页面模型中
"<custom-package>/CustomServiceForNestedSelects"
注意:强>
答案 2 :(得分:1)
Aikau实际上提供了开箱即用的级联菜单,请参阅alfresco / menus / AlfCascadingMenu小部件。 Alfresco中已经存在其使用的示例(例如,Share中主标题中的sites菜单下的收藏夹列表)。如果您已经知道级联内容,则可以在页面WebScript中定义这些内容。但是,如果您需要动态更改级联菜单的内容,那么您应该查看alfresco / header / AlfSitesMenu或alfresco / documentlibrary / AlfCreateTemplateContentMenu的实现(您可以在Aikau GitHub project中找到源代码)。
答案 3 :(得分:0)
用它作为我自己的级联选择的基础。建立在与Marco Altieri描述的相同概念上