开发者社区> 问答> 正文

流程表单中的“数值”控件,怎么做数据效验,如输入的数据不能大于100,如大于100就出错误提示信息

流程表单中的“数值”控件,怎么做数据效验,如输入的数据不能大于100,如大于100就出错误提示信息

展开
收起
游客uzv475co2r4jc 2023-09-25 09:30:17 640 4
来自:钉钉宜搭
4 条回答
写回答
取消 提交回答
  • 十分耕耘,一定会有一分收获!

    楼主你好,您可以在控件中设定“数据验证规则”,以限制输入的数值不得大于100。具体步骤如下:

    1. 选中数值控件,在右侧属性面板中找到“数据验证规则”
    2. 点击“新建规则”,在弹出窗口中输入规则名称,如“数值不大于100”,选择“数值范围”选项,并在“最大值”栏中输入100
    3. 在“错误提示信息”栏中输入提示信息,如“数值不能大于100”
    4. 点击“保存”按钮保存规则,再次点击“保存”按钮保存流程表单

    完成以上步骤后,当用户在该数值控件中输入的数值大于100时,系统会自动弹出错误提示信息,指导用户修改输入的数值。

    2023-09-27 09:16:32
    赞同 7 展开评论 打赏
  • 要实现这个功能,你需要使用表单验证。以下是一个简单的示例:

    1. 首先,在表单设计器中添加一个“数值”控件,并为其设置一个ID,例如numInput
    2. 然后,创建一个错误提示信息元素,例如一个带有错误图标的div,并为其设置一个ID,例如errorMsg
    3. 接下来,编写一个JavaScript函数来检查输入值是否大于100。如果是,则显示错误提示信息;否则,清除错误提示信息。
    4. 最后,为“数值”控件添加一个oninput事件监听器,以便在用户输入值时调用验证函数。

    以下是一个示例代码:

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>表单验证示例</title>
        <style>
            .error {
                color: red;
                display: none;
            }
        </style>
    </head>
    <body>
        <form id="myForm">
            <div id="numInput">
                <input type="number" id="numInput" min="0" step="1">
            </div>
            <div id="errorMsg" class="error">输入的数据不能大于100</div>
            <button type="submit">提交</button>
        </form>
        <script>
            const numInput = document.getElementById('numInput');
            const errorMsg = document.getElementById('errorMsg');
            const form = document.getElementById('myForm');
    
            function validateInput() {
                if (numInput.value > 100) {
                    errorMsg.style.display = 'block';
                } else {
                    errorMsg.style.display = 'none';
                }
            }
    
            numInput.addEventListener('input', validateInput);
            form.addEventListener('submit', (e) => {
                e.preventDefault();
                if (!errorMsg.style.display) {
                    // 在这里处理表单提交逻辑
                    console.log('表单提交成功');
                } else {
                    console.log('表单提交失败,因为输入的数据不能大于100');
                }
            });
        </script>
    </body>
    </html>
    

    这个示例中,当用户在“数值”控件中输入值时,会触发validateInput函数,该函数会检查输入值是否大于100。如果大于100,错误提示信息将显示;否则,错误提示信息将被隐藏。当用户提交表单时,也会进行相同的验证。如果输入值不满足条件,表单提交将被阻止,并在控制台中显示相应的错误消息。

    2023-09-26 20:04:40
    赞同 3 展开评论 打赏
  • image.png
    image.png
    功能确实有,但是好像不好用啊,大小都没提示。

    2023-09-26 11:59:21
    赞同 5 展开评论 打赏
  • 十年摸盘键,代码未曾试。 今日码示君,谁有上云事。

    可以用节点提交规则来检验,节点提交规则的作用是在用户提交流程或者审批人处理流程时,可以通过一些公式校验判断用户是否能执行此操作,或者可以触发业务关联公式来更新其他表单的数据。

    流程表单 >> 编辑流程表单旁倒三角符号 >> 流程设计 >> 全局配置 >> 节点提交规则

    选择新增规则,弹出对话框,可在对话框选择对应实现操作的节点以及规则设置

    选择需要实现节点提交规则的节点,节点类型可选择为「开始」、「结束」、「审批节点」

    提交数据时为开始节点,在提交数据时就会执行规则。

    流程结束时为结束节点,流程可通过不同的节点动作结束节点,因此选择结束节点时,需继续选择节点动作,给对应的节点动作配置规则,节点动作分为「同意」、「拒绝」、「撤销/终止」。

    审批节点为流程设置中的审批人节点以及执行人节点,可直接进行选择。选择后,需要对应选择触发方式以及当前节点的节点动作。

    当触发方式为「任务完成执行」时,节点动作可选择「同意」「拒绝」「保存」「退回」,规则类型可选择「检验规则」「关联操作」

    当触发方式为「节点完成执行」时,节点动作可选择「同意」「拒绝」,规则类型可选择「关联操作」。

    注意:节点状态不能为空

    在节点提交操作时做判断,可以阻断当前操作,不满足条件可以阻止提交操作。

    如下图案例:

    检验公式判断单行文本是否等于 23,返回 true 时阻断提交并提示“年龄不能等于 23”

    当单行文本填写 23 并提交数据时,自动进行阻断并提示“年龄不能等于 23”。

    2023-09-25 10:40:35
    赞同 4 展开评论 打赏
问答分类:
问答地址:
关联地址:
来源圈子
更多
收录在圈子:
+ 订阅
「宜搭」是云钉原生低代码平台(钉钉 PaaS - aPaaS),让企业应用搭建更简单! 帮助中小企业降本提效,加强组织的数字化自主权; 帮助大型企业释放个体创新力,助力组织创新涌现。
问答排行榜
最热
最新

相关电子书

更多
低代码开发师(初级)实战教程 立即下载
冬季实战营第三期:MySQL数据库进阶实战 立即下载
阿里巴巴DevOps 最佳实践手册 立即下载