验证 xPage 上的编辑框输入文本长度

Question

当我启用字段长度验证时，它仅在我提交表单时验证...

<?xml version="1.0" encoding="UTF-8"?>

<xp:inputText id="inputText1">
    <xp:this.validators>
        <xp:validateLength maximum="20"
            message="You can input max 20 characters">
        </xp:validateLength>
    </xp:this.validators>
</xp:inputText>
<xp:message id="message1" for="inputText1"></xp:message>

那么如何在用户输入第 21 个字符后显示错误消息？假设需要一个 CSJS 代码...

Answer 1

将客户端事件处理程序 "onkeyup" 添加到您的 inputText 控件：

    <xp:eventHandler
        event="onkeyup"
        submit="false">
        <xp:this.script><![CDATA[
            thisEvent.srcElement.value = thisEvent.srcElement.value.substring(0, 20)
        ]]></xp:this.script>
    </xp:eventHandler>

如有必要，它会将文本缩短到最大长度。

您可以将消息显示为警报

            var element = thisEvent.srcElement;
            if (element.value.length > 20) {
                element.value = element.value.substring(0, 20);
                alert("You can input max 20 characters");
            }

或者您可以将客户端消息文本字段添加到您的 XPage，并在达到最大长度时用消息填充它

<xp:inputText id="inputText1">
    <xp:this.validators>
        <xp:validateLength  maximum="20"
            message="You can input max 20 characters">
        </xp:validateLength>
    </xp:this.validators>
    <xp:eventHandler
        event="onkeyup"
        submit="false">
        <xp:this.script><![CDATA[
            var element = thisEvent.srcElement;
            var message = document.getElementById("#{id:clientMessage}");
            if (element.value.length > 20) {
                element.value = element.value.substring(0, 20);
                message.innerHTML = "You can input max 20 characters";
            } else {
                message.innerHTML = "";
            }
        ]]></xp:this.script>
    </xp:eventHandler>
    </xp:inputText>
<xp:text id="clientMessage" value="" />

验证 xPage 上的编辑框输入文本长度

validate edit box input text length on xPage

xpages

lotus-notes