1

我有一个<h:datatable>有两列的 JSF。

  • 第 1 列:<h:outputText>,从 bean 数据中填充。
  • 第2栏:<h:inputText>盒子。

表外有一个“总计”字段,我想让它实时显示在 column2 中输入的字段总数。所以我四处寻找,发现我需要一个 JavaScript 来做到这一点。然而,我对 JS 很陌生。

我感到困惑的是如何访问输入文本框的值。到目前为止我做了什么:

function totalFrom() {
    var element = document.getElementById('transferFundsForm:fundsFromTable:0:from_transferAmt');
    if(element != null){
        document.forms['transferFundsForm']['transferFundsForm:totalFrom'].value = document.forms['transferFundsForm']['transferFundsForm:totalFrom'].value+ element;
    }
}

据我了解,transferFundsForm:fundsFromTable:0这里的 ,0代表第一行。如何引用正在编辑的列中的元素?

我已经onblur在列中文本框的事件上调用了这个函数。

另外我读到我也可以使用<f:ajax>它,但是我使用的是 JSP 而不是 Facelets,所以我不能使用<f:ajax>.

4

2 回答 2

1

element 的 HTML DOM 元素表示<table>具有一个rows属性<tr>,它为您提供所有元素的数组。该<tr>元素的 HTML DOM 表示具有一个cells属性<td>,它为您提供所有元素的数组。

因此,如果表格的第二列仅包含一个包含<input>您想要总结的值的元素,并且这totalFrom是一个<input>元素(至少,您尝试设置value属性而不是innerHTML),您可以实现如下:

function totalFrom() {
    var table = document.getElementById('transferFundsForm:fundsFromTable');
    var total = 0;

    for (var i = 0; i < table.rows.length; i++) {
        var secondColumn = table.rows[i].cells[1];
        var input = secondColumn.getElementsByTagName('input')[0];
        var value = parseInt(input.value);

        if (!isNaN(value)) {
            total += value;
        }
    }

    document.getElementById('transferFundsForm:totalFrom').value = total;
}

但是,如果totalFrom是 a <h:outputText id="totalFrom">,则将其设置如下:

    document.getElementById('transferFundsForm:totalFrom').innerHTML = total;
于 2013-01-05T15:38:14.160 回答
-1

为什么不使用 jsf 服务器端事件或用户 http://livedemo.exadel.com/richfaces-demo/ 它还为您提供内置 ajax 功能

于 2013-01-04T12:54:28.373 回答