客户端计算不起作用

Question

我有一个5 x 5的复选框表，根据用户选择的成本进行计算（这有点复杂，但您会明白：o）。我想使用客户端JavaScript（这是一个非关键的内部XPages应用）进行计算，但似乎无法更新屏幕上的值。我创建了一个简单的形式，试图让JavaScript的工作 - 在这里就是我：

1. ，只是上有一个字段的表单 - >“计数”的型号

2. 的用的XPage下面的代码：

<xp:this.resources> 
    <xp:script src="/jsTest.js" clientSide="true"></xp:script> 
</xp:this.resources> 
<xp:this.data> 
    <xp:dominoDocument var="document1" formName="x. Test"></xp:dominoDocument> 
</xp:this.data> 
<xp:panel style="padding-bottom:60.0px;padding-top:60.0px"> 
    <div class="container"> 

     <legend>Test</legend> 
     <div class="row"> 
      <label class="col-md-4 control-label">Nachname</label> 
      <div class="col-md-8"> 
       <xp:checkBox text="test checkbox" id="checkBox1"> 
        <xp:eventHandler event="onclick" submit="false"> 
         <xp:this.script> 
          <xp:executeClientScript script="updateCount();"></xp:executeClientScript> 
         </xp:this.script> 
        </xp:eventHandler> 
       </xp:checkBox> 
      </div> 
     </div> 

     <div class="row"></div> 

     <div class="row"> 
      <label class="col-md-4 control-label">Count</label> 
      <div class="col-md-8"> 
      <xp:inputText id="inputText1" value="#{document1.count}" defaultValue="0"> 
       <xp:this.converter> 
        <xp:convertNumber type="number"></xp:convertNumber> 
       </xp:this.converter> 
      </xp:inputText> 
      </div> 
     </div> 

    </div> 
</xp:panel> 

只需点击一个复选框，即可将一个复选框添加到计数字段中。

的JavaScript安装于复选框的代码：

function updateCount() { 
 
\t 
 
\t var currVal = XSP.getElementById("#{id:inputText1}").value; 
 
\t XSP.getElementById("#{id:inputText1}").value = currVal + 1; 
 
\t 
 
}

当我点击复选框我得到以下错误：

TypeError：null不是一个对象（评估'XSP.getElementById（“＃{id：inputText1}”）。''）

我假设JavaScript无法在DOM中找到项目inputText1？任何想法我做错了吗？先谢谢你！

Answer 1

我认为你的函数在脚本库中？

库无法解析＃{id：inputText1}引用。

更改的功能如下：

function updateCount (elem) { 
    currVal = parseInt(elem.value); 
    elem.value = parseInt(1) + currVal; 
} 

然后当你调用它，把它想：

<xp:eventHandler event="onclick" submit="false"> 
    <xp:this.script> 
     <xp:executeClientScript 
      script="updateCount(XSP.getElementById('#{id:inputText1}'))">  
     </xp:executeClientScript> 
    </xp:this.script> 
</xp:eventHandler> 

你需要来定制你的功能，以适应您的需求。您可能还需要传入其他字段的值以获取实际值。

编辑

您还可以添加你的函数在输出脚本/ XP：直接在XPage中或自定义控制脚本块，如果你不需要在很多地方重新使用它：

<xp:scriptBlock id="scriptBlock1"> 
    <xp:this.value><![CDATA[function updateCount() { 
     var val1 = parseInt(XSP.getElementById("#{id:inputText1}").value); 
     var val2 = parseInt(XSP.getElementById("#{id:inputText2}").value); 
     var val3 = parseInt(XSP.getElementById("#{id:inputText3}").value); 
     var val4 = parseInt(XSP.getElementById("#{id:inputText4}").value); 

     var currVal = val1 + val2 + val3 + val4; 

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