Oracle apex: Javascript для отображения суммы столбца в интерактивном отчете на основе строки флажка - PullRequest
Новая
       17

Oracle apex: Javascript для отображения суммы столбца в интерактивном отчете на основе строки флажка

1 голос
/ 01 октября 2019

У меня есть интерактивный отчет с флажком (selectunselectall) и столбцом 2 (countthisrow) с номерами. Мне нужно отобразить сумму столбца 2 в текстовом элементе после интерактивного отчета, когда проверяется строка в столбце 1. Я назначил статический идентификатор для column2, но не смог понять, как написать динамическое действие с помощью javascript. 

<tr>
    <td class=" u-tC" aria-labelledby="selectunselectall" headers="selectunselectall"><input name="f01" type="checkbox" value="1"></td>
    <td class=" u-tC" aria-labelledby="C4665519416385240" headers="C4665519416385240">id1</td>
    <td class=" u-tC" aria-labelledby="countthisrow" headers="countthisrow">1</td>
    <td class=" u-tC" aria-labelledby="C4665768588385242" headers="C4665768588385242">abcd</td>
    <td class=" u-tC" aria-labelledby="C4665808804385243" headers="C4665808804385243">a</td>
</tr>
<tr>
    <td class=" u-tC" aria-labelledby="selectunselectall" headers="selectunselectall"><input name="f02" type="checkbox" value="2"></td>
    <td class=" u-tC" aria-labelledby="C4665519416385240" headers="C4665519416385240">id1</td>
    <td class=" u-tC" aria-labelledby="countthisrow" headers="countthisrow">2</td>
    <td class=" u-tC" aria-labelledby="C4665768588385242" headers="C4665768588385242">abcd</td>
    <td class=" u-tC" aria-labelledby="C4665808804385243" headers="C4665808804385243">a</td>
</tr>

1 Ответ

0 голосов
/ 01 октября 2019

Ur Html Я беру div, чтобы показать значение, дающее идентификатор этому div 

<div id="total">Total val: </div>

<table>
  <tr>
    <td class=" u-tC" aria-labelledby="selectunselectall" headers="selectunselectall">
      <input name="f01" type="checkbox" value="1" id="f01">
    </td>
    <td class=" u-tC" aria-labelledby="C4665519416385240" headers="C4665519416385240">id1</td>
    <td class=" u-tC" aria-labelledby="countthisrow" headers="countthisrow">1</td>
    <td class=" u-tC" aria-labelledby="C4665768588385242" headers="C4665768588385242">abcd</td>
    <td class=" u-tC" aria-labelledby="C4665808804385243" headers="C4665808804385243">a</td>
</tr>
<tr>
    <td class=" u-tC" aria-labelledby="selectunselectall" headers="selectunselectall">
      <input name="f02" type="checkbox" value="2" id="f02">
    </td>
    <td class=" u-tC" aria-labelledby="C4665519416385240" headers="C4665519416385240">id1</td>
    <td class=" u-tC" aria-labelledby="countthisrow" headers="countthisrow">2</td>
    <td class=" u-tC" aria-labelledby="C4665768588385242" headers="C4665768588385242">abcd</td>
    <td class=" u-tC" aria-labelledby="C4665808804385243" headers="C4665808804385243">a</td>
  </tr>
</table>

ur javascript

сначала вызовите id элемента, затем создайте addEventListener для захвата егоvalue возьмите итоговую переменную, где я присваиваю значение выбранному флажку, а затем отображаю его в общем div 

const checkbox1 = document.getElementById('f01')
const checkbox2 = document.getElementById('f02')
const totalVal = document.getElementById('total')

var total = 0;

checkbox1.addEventListener('change', (event) => {
  total += parseInt(event.target.value)
  totalVal.innerHTML = total
})

checkbox2.addEventListener('change', (event) => {
  total += parseInt(event.target.value)
  totalVal.innerHTML = total
})

Надеюсь, это поможет, если вам нужно что-то еще, что вы можете сказать. Спасибо

...