基于按钮而不是选择框的流程活动路由


在典型的表单活动设计中,下一步的行为往往是使用表单域中的一个字段来确定的。我们可以在下面的截图中看到这样的例子。

图1:使用生成流程 - 审批流程审批表  

通过使用一些客户端脚本,我们可以改变从选择框到单个按钮的决策方式,如下面的截图所示。

图2:决策按钮

这个设计可能更适合于以前使用过类似设计的系统的某些用户群。

为了实现这个设计,我们需要首先获取选择框的“名称”。请看下面的截图。

图3:识别元素名称

创建一个  自定义HTML到你想要的形式,并粘贴在下面的代码。将第2行更改为选择框的名称。

<script type="text/javascript">
var selectBoxName = "approval_request_approval_action_status";
$(function(){
    $(FormUtil.getField(selectBoxName)).parent().hide();
    $(FormUtil.getField(selectBoxName)).children().each(function(){
        if($(this).attr("value") != ""){
            var cssClass = $(".form-button:last").attr("class");
            var button = "<div type=\"button\" class=\"form-cell\"><button class=\"" + cssClass + "\" onclick=\"completeWithVariable($(this));return false;\" value=\"" + $(this).attr("value") + "\">" + $(this).attr("value") + "</button></div>";
            $(".form-button:last").after(button);
        }
    });
});
function completeWithVariable(obj){
    $(FormUtil.getField(selectBoxName)).val($(obj).val());
    $("#assignmentComplete").trigger("click");
}
</script>
<style type="text/css">
    input#assignmentComplete{
        display: none;
    }
</style>


文档更新时间: 2018-11-08 03:49   作者:龙威