XPages 中的 bootstrapValidator

Posted 2023-05-08

【中文标题】XPages 中的 bootstrapValidator

【英文标题】：bootstrapValidator in XPages

【发布时间】：2019-06-07 20:04:50

【问题描述】：

我的 XPage 中有以下代码，但是它不适用于给定字段 ipAddress，即使它是空白的，它也不会提示任何验证，我也尝试使用 #id:ipAddress，它不起作用.我正在使用 Notes 9 和 Designer 9。任何人都可以帮助我使用 bootstrapValidator 功能在 XPages 中进行字段验证的其他方式。

     <?xml version="1.0" encoding="UTF-8"?>
            <xp:view xmlns:xp="http://www.ibm.com/xsp/core" id="testid">
            <xp:this.resources>
                <xp:styleSheet href="/bootstrap.css"></xp:styleSheet>
                <xp:styleSheet href="/bootstrapValidator.min.css"></xp:styleSheet>
                <xp:script src="/jquery-1.11.1.js" clientSide="true"></xp:script>
                <xp:script src="/bootstrap.min.js" clientSide="true"></xp:script>
                <xp:script src="/bootstrapValidator.js" clientSide="true"></xp:script>
                <xp:script src="/jquery.mask.min.js" clientSide="true"></xp:script>
            </xp:this.resources>
            <xp:form id="maskForm">
          <div class="col-lg-5">
      <xp:inputText id="ipAddress" title="ipAddress">
        </xp:inputText>
        </div>
            </xp:form>
            <xp:scriptBlock>
                <xp:this.value><![CDATA 

var test ="view:_id1";
        var fieldvalue="#view:_id1:_id4:_id142:_id143:callback1:idLocation";
      XSP.addOnLoad( function() 
        $("#"+test).bootstrapValidator(
        message: 'This value is not valid',
        feedbackIcons: 
            valid: 'glyphicon glyphicon-ok',
            invalid: 'glyphicon glyphicon-remove',
            validating: 'glyphicon glyphicon-refresh'
        ,
        fields: 
           fieldvalue: 
                message: 'The username is not valid',
                validators: 
                    notEmpty: 
                        message: 'The username is required and can\'t be empty'
                    ,
                    stringLength: 
                        min: 6,
                        max: 30,
                        message: 'The username must be more than 6 and less than 30 characters long'
                    ,
                    regexp: 
                        regexp: /^[a-zA-Z0-9_\.]+$/,
                        message: 'The username can only consist of alphabetical, number, dot and underscore'
                    
                
              ) );

            ]]></xp:this.value>
            </xp:scriptBlock>
            </xp:view>

    <!-- end snippet -->

这里附上图片，根据你的建议输出 image of error

imager of errorerro 3

【参考方案1】：

当您检查您的 html 源代码时，您会发现 id 属性已被更改。 HTML 规范要求 ID 是唯一的，因此 JSF 修改了名称。

在您的脚本块中，您需要将它们存储在变量中，而不是按字面意思使用它们。

您已经为表单执行了该操作。对字段也这样做。

更新

您的代码可能需要如下所示（在 CDATA 中）：

      XSP.addOnLoad( function() 
     // You might need one more #
        $('#id:maskForm').bootstrapValidator(
        message: 'This value is not valid',
        feedbackIcons: 
            valid: 'glyphicon glyphicon-ok',
            invalid: 'glyphicon glyphicon-remove',
            validating: 'glyphicon glyphicon-refresh'
        ,
        fields: 
           '#id:ipAddress': 
                message: 'The username is not valid',
                validators: 
                    notEmpty: 
                        message: 'The username is required and can\'t be empty'
                    ,
                    stringLength: 
                        min: 6,
                        max: 30,
                        message: 'The username must be more than 6 and less than 30 characters long'
                    ,
                    regexp: 
                        regexp: /^[a-zA-Z0-9_\.]+$/,
                        message: 'The username can only consist of alphabetical, number, dot and underscore'
                    
                
              ) );

        ]]>

片段中的唯一字段是ipAddress - 这就是我的示例使用的。 这里的诀窍是：用提供实际 id 的 XPages 表达式语言替换静态 ID。您的脚本块在将数据发送到浏览器之前处理表达式。浏览器在不知道数据经过预处理的情况下获取数据。

因此，如果您有<input id="Color" />，则使用#id:Color 获取实际ID。

但是，您可能会重新考虑您的方法。 XPages 具有出色的验证器，它们与字段一起存储并提供您正在寻找的大部分内容。将验证外部化，当您的字段更改时，您需要不断地更改代码。将字段和验证放在一起！

【讨论】：

我也添加了下面的代码，但它不起作用，请在主帖中查看上面修改过的代码，我也尝试使用这两个变量，但它不起作用。 var test ="view:_id1"; var fieldvalue="#"+'#javascript:getClientId("idLocation")';

那段代码什么也没做。您仍然有一个静态文本字段值：在您的字段 Json 对象中。您需要在那里计算该 ID。

感谢@stwissel，请查看我在实施您的解决方案后遇到的错误。

这是此链接中的错误消息：i.stack.imgur.com/IuSBL.png

我也不想在 xpage 上指定特定的 xp:form 标签。如何引用 xpage 的默认形式？ $("'view:_id1'").bootstrapValidator( 会做事吗？