本文介绍了Alfresco 社区 5.1.x
工作流表单动态添加输入字段的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我使用的是 Alfresco Community 5.1.x.当 + 按钮动态添加文本字段时，我想使用 kickstart 创建一个自定义工作流程，在我有 + 按钮的表单之一中.这可能吗?怎么样?
解决方案
我希望你能从这个控件中得到一些想法.
关于共享配置，
用户详细信息.ftl.yui-dt{边框:1px 实心 #ccc；字体粗细:正常；}.yui-dt {边距:0；填充:0；边界:无；右边框:1px 实心#CBCBCB；边框底部:1px 实心#CBCBCB；背景:#D8D8DA url(sprite.png) repeat-x 0 0;}.yui-dt {边距:0；填充:0；边界:无；右边框:1px 实心#CBCBCB；边框底部:1px 实心#CBCBCB；背景:#D8D8DA url(sprite.png) repeat-x 0 0;}.yui-dt td {边框顶部:1px 实心 #ccc!important;填充:5px 10px！重要；}.yui-dt td:last-of-type,.yui-dt th:last-of-type {右边框:0px 实心 #CBCBCB；}.yui-dt td:last-of-type {边框顶部:0px 实心 #CBCBCB；}.yui-dt-liner {边距:0；填充:0；填充:4px 10px 4px 10px！重要；}.set-title {字体大小:116%；边框底部:1px 实心 #eeeeee;填充底部:0.1em；底边距:0.6em；边距顶部:0.2em；}.纽扣{背景:#fff;边框:1px 实心 #ddd;填充:4px；游标:指针；}.buttons:悬停{背景:#EAE8E8;}.超链接{颜色:蓝色！重要；文字装饰:下划线！重要填充:5px；}</风格><@link href="${url.context}/res/components/workflow/workflow-form.css" group="workflow"/><#include "/org/alfresco/components/form/controls/common/utils.inc.ftl"/><div class="form-field"><#if form.mode == "view" ||(form.mode == "edit" && field.disabled)><div class="viewmode-field"><span class="viewmode-label">${field.label?html}:</span><span class="viewmode-value"><div id="divUserList"><label>用户列表:</label><table id="tblUserList" class="yui-dt" style="width:100%"><tr><td>名字 </td><td>姓氏</td><td>电子邮件 ID</td><td>动作</td></tr><tr id="placeHolderRow"><td colspan="4"><span>不需要用户详细信息.</span></td></tr></span>
<#else><div id="divUserList"><div id="divButtonContainer"><label>名字:<span class="mandatory-indicator">${msg("form.required.fields.marker")}</span></label><input type="text" id="txtFirstName" style="margin-bottom:10px;"><label>姓氏:<span class="mandatory-indicator">${msg("form.required.fields.marker")}</span></label><input type="text" id="txtLastName" style="margin-bottom:10px;"><label>Email-Id : <span class="mandatory-indicator">${msg("form.required.fields.marker")}</span></label><input type="text" id="emailId" style="margin-bottom:20px;"><br><input class="buttons" id="btnAdd" onclick="javascript:addRows();return false;"type="button" value="添加另一个用户"/><input class="buttons" style="background:#fff" id="btnClear" onclick="javascript:clearControls();return false;"type="button" value="清除所有用户"/>
<div class="set-title" style="margin-top:20px;">用户列表:
<table id="tblUserList" class="yui-dt" style="width:100%"><tr><th style="background: #D8D8DA;padding-left: 10px;padding-right: 10px;padding-top: 5px;padding-bottom: 5px;"class="yui-dt-liner">名字</th><th style="background: #D8D8DA;padding-left: 10px;padding-right: 10px;padding-top: 5px;padding-bottom: 5px;"class="yui-dt-liner">Last Name</th><th style="background: #D8D8DA;padding-left: 10px;padding-right: 10px;padding-top: 5px;padding-bottom: 5px;"class="yui-dt-liner">电子邮件 ID<th style="background: #D8D8DA;padding-left: 10px;padding-right: 10px;padding-top: 5px;padding-bottom: 5px;"class="yui-dt-liner">Actions</th></tr><tr id="placeHolderRow"><td class="yui-dt-liner" colspan="4" style="border-right:none;"><span>不需要用户详细信息.</span></td></tr>
<#-- 保留隐藏控件，将值发送到 repo --><input type="hidden" id="${fieldHtmlId}" name="${field.name}"/></#if>
<脚本>更新控制模式()；函数更新控制模式(){var readOnly = "${field.disabled?c}";如果(只读 ==真"){document.getElementById("tblUserList").innerHTML = '${field.value}';var table = document.getElementById("tblUserList");for (var i = 0;i<table.rows.length; i++) {var row = table.rows[i];for (var j = 0;j元素并将其添加到表格的第一个位置:var row = table.insertRow(rowLength);row.id = Alfresco.util.generateDomId();//在new"的第一个和第二个位置插入新单元格(| 元素)元素:var cell1 = row.insertCell(0);var cell2 = row.insertCell(1);var cell3 = row.insertCell(2);var cell4 = row.insertCell(3);//向新单元格添加一些文本:cell1.innerHTML = document.getElementById("txtFirstName").value;cell1.style="颜色:红色";cell2.innerHTML = document.getElementById("txtLastName").value;cell3.innerHTML = document.getElementById("emailId").value;cell4.innerHTML ="<a class='hyperlink' style='margin-right:10px' href='#' onclick='javascript:editRow(this);return false;'> 编辑 </a> <;a href='#' class='hyperlink' onclick='javascript:deleteRow(this);return false;'> 删除 </a> ";/* 设置内容 */document.getElementById("${fieldHtmlId}").value = table.outerHTML.replace(/(
|
|)/gm,"");清除控制()；}函数清除(){document.getElementById("txtFirstName").value="";document.getElementById("txtLastName").value="";document.getElementById("emailId").value="";} 如果您希望此控件为只读，则在共享配置中添加read-only="true". 请注意:截至目前，这还没有准备好生产，我们也处于开发模式.我们希望改进这种控制，请分享您的想法/评论/反馈.I am using Alfresco Community 5.1.x. I want to create a custom workflow using kickstart in that one of the forms I have + button when + button add text fields dynamically. Is this possible? How? 解决方案
I hope you will get some idea from this control.
On Share configration, <field id="myco:userDetails" set="userDetails" label="User Details" >
<control template="/org/alfresco/components/form/controls/workflow/userdetails.ftl" />
</field>
userdetails.ftl <style>
.yui-dt{
border: 1px solid #ccc;
font-weight: normal;
}
.yui-dt th {
margin: 0;
padding: 0;
border: none;
border-right: 1px solid #CBCBCB;
border-bottom: 1px solid #CBCBCB;
background: #D8D8DA url(sprite.png) repeat-x 0 0;
}
.yui-dt th {
margin: 0;
padding: 0;
border: none;
border-right: 1px solid #CBCBCB;
border-bottom: 1px solid #CBCBCB;
background: #D8D8DA url(sprite.png) repeat-x 0 0;
}
.yui-dt td {
border-top: 1px solid #ccc!important;
padding: 5px 10px!important;
}
.yui-dt td:last-of-type,.yui-dt th:last-of-type {
border-right: 0px solid #CBCBCB;
}
.yui-dt td:last-of-type {
border-top: 0px solid #CBCBCB;
}
.yui-dt-liner {
margin: 0;
padding: 0;
padding: 4px 10px 4px 10px!important;
}
.set-title {
font-size: 116%;
border-bottom: 1px solid #eeeeee;
padding-bottom: 0.1em;
margin-bottom: 0.6em;
margin-top: 0.2em;
}
.buttons{
background:#fff;
border:1px solid #ddd;
padding:4px;
cursor:pointer;
}
.buttons:hover{
background:#EAE8E8;
}
.hyperlink{
color: blue!important;
text-decoration: underline!important
padding:5px;
}
</style>
<@link href="${url.context}/res/components/workflow/workflow-form.css" group="workflow"/>
<#include "/org/alfresco/components/form/controls/common/utils.inc.ftl" />
<div class="form-field">
<#if form.mode == "view" || (form.mode == "edit" && field.disabled)>
<div class="viewmode-field">
<span class="viewmode-label">${field.label?html}:</span>
<span class="viewmode-value">
<div id="divUserList">
<label>User List:</label>
<table id="tblUserList" class="yui-dt " style="width:100%">
<tr>
<td>First Name </td>
<td>Last Name</td>
<td> Email-Id</td>
<td>Actions</td>
</tr>
<tr id="placeHolderRow">
<td colspan="4"><span>No user details are requested.</span></td>
</tr>
</table>
</div>
</span>
</div>
<#else>
<div id="divUserList">
<div id="divButtonContainer">
<label>First Name : <span class="mandatory-indicator">${msg("form.required.fields.marker")}</span></label>
<input type="text" id="txtFirstName" style="margin-bottom:10px;">
<label>Last Name : <span class="mandatory-indicator">${msg("form.required.fields.marker")}</span></label>
<input type="text" id="txtLastName" style="margin-bottom:10px;">
<label>Email-Id : <span class="mandatory-indicator">${msg("form.required.fields.marker")}</span></label>
<input type="text" id="emailId" style="margin-bottom:20px;"> <br>
<input class="buttons" id="btnAdd" onclick="javascript:addRows();return false;" type="button" value="Add another user" />
<input class="buttons" style="background:#fff" id="btnClear" onclick="javascript:clearControls();return false;" type="button" value="Clear all users" />
</div>
<div class="set-title" style="margin-top:20px;"> User List:</div>
<table id="tblUserList" class="yui-dt " style="width:100%">
<tr>
<th style="background: #D8D8DA;padding-left: 10px;padding-right: 10px;padding-top: 5px;padding-bottom: 5px;" class="yui-dt-liner">First Name </th>
<th style="background: #D8D8DA;padding-left: 10px;padding-right: 10px;padding-top: 5px;padding-bottom: 5px;" class="yui-dt-liner">Last Name</th>
<th style="background: #D8D8DA;padding-left: 10px;padding-right: 10px;padding-top: 5px;padding-bottom: 5px;" class="yui-dt-liner"> Email-Id</th>
<th style="background: #D8D8DA;padding-left: 10px;padding-right: 10px;padding-top: 5px;padding-bottom: 5px;" class="yui-dt-liner">Actions</th>
</tr>
<tr id="placeHolderRow">
<td class="yui-dt-liner" colspan="4" style="border-right:none;">
<span>No user details are requested.</span>
</td>
</tr>
</table>
</div>
<#-- Keep the hidden control, to sent the values to the repo -->
<input type="hidden" id="${fieldHtmlId}" name="${field.name}" />
</#if>
</div>
<script>
updateControlMode();
function updateControlMode()
{
var readOnly = "${field.disabled?c}";
if (readOnly =="true")
{
document.getElementById("tblUserList").innerHTML = '${field.value}';
var table = document.getElementById("tblUserList");
for (var i = 0;i<table.rows.length; i++) {
var row = table.rows[i];
for (var j = 0;j<row.cells.length; j++) {
var col = row.cells[j];
if (j == 3)
{
col.parentNode.removeChild(col); //Removing the action column in readOnly mode
}
}
}
}
}
function clearControls()
{
document.getElementById("txtFirstName").value="";
document.getElementById("txtLastName").value="";
document.getElementById("emailId").value="";
}
function deleteRow(btn) {
var row = btn.parentNode.parentNode;
row.parentNode.removeChild(row);
var table = document.getElementById("tblUserList");
var rowLength = table.rows.length;
if (rowLength ==1 ) //Only Table header is present
{
var placeHolderRow = table.insertRow(rowLength);
var cell1 = placeHolderRow.insertCell(0);
cell1.colspan="4";
cell1.innerHTML="No user details are requested."
}
}
function addRows()
{
var placeHolderRow = document.getElementById("placeHolderRow");
if (placeHolderRow)
placeHolderRow.remove();
var firstName = document.getElementById("txtFirstName").value;
var lastName =document.getElementById("txtLastName").value;
var emailId = document.getElementById("emailId").value;
if (!(firstName || lastName || emailId || firstName.value.trim().length == 0 || lastName.value.trim().length || emailId.value.trim().length))
{
alert("Please enter all the values");
return false;
}
var table = document.getElementById("tblUserList");
var rowLength = table.rows.length;
// Create an empty <tr> element and add it to the 1st position of the table:
var row = table.insertRow(rowLength);
row.id = Alfresco.util.generateDomId();
// Insert new cells (<td> elements) at the 1st and 2nd position of the "new" <tr> element:
var cell1 = row.insertCell(0);
var cell2 = row.insertCell(1);
var cell3 = row.insertCell(2);
var cell4 = row.insertCell(3);
// Add some text to the new cells:
cell1.innerHTML = document.getElementById("txtFirstName").value;
cell1.style="color:red";
cell2.innerHTML = document.getElementById("txtLastName").value;
cell3.innerHTML = document.getElementById("emailId").value;
cell4.innerHTML ="<a class='hyperlink' style='margin-right:10px' href='#' onclick='javascript:editRow(this);return false;'> Edit </a> <a href='#' class='hyperlink' onclick='javascript:deleteRow(this);return false;'> Delete </a> ";
/* Set the content */
document.getElementById("${fieldHtmlId}").value = table.outerHTML.replace(/(
|
|)/gm,"");
clearControls();
}
function clear()
{
document.getElementById("txtFirstName").value="";
document.getElementById("txtLastName").value="";
document.getElementById("emailId").value="";
}
</script>
If you want this control as, read-only then,add read-only="true" in the share configuration. <field id="myco:userDetails" set="userDetails" read-only="true" label="User Details" >
<control template="/org/alfresco/components/form/controls/workflow/userdetails.ftl" />
</field>
Please note: As of now, this is not production ready and we're also in developement mode. We want to improve this control, please share your idea / comments/ feedback.
更多推荐
Alfresco 社区 5.1.x 工作流表单动态添加输入字段
本文发布于:2023-11-28 09:25:48，感谢您对本站的认可！
版权声明:本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系，我们将在24小时内删除。
本文标签：工作流 字段 表单 动态 社区
|
从源“http://localhost:5173”访问“...”处的 XMLHttpRequest 已被 CORS 策略阻止 
币安API错误代码1102，未发送强制参数“时间戳” 
如果我在bot telegram nodejs中使用editMessageMedia，我如何制作标题 
在 Node.js 中从网络流创建 blob 
使用 Node.js / ES6 如何设置 dotenv 文件的自定义路径？ 
使用 NODE.JS 和 html5 实现低延迟（50 毫秒）视频流 
如何从nodejs连接laravel>laravel 
使用nodejs观看目录 
如果文件包含特定字符串，如何跳过 GitHub 工作流程步骤？ 
FirebaseError：无法从.env加载环境变量
发布评论