Гравитационные формы используют JS для подсчета строк в списке и возврата в поле?

Question

Я пытаюсь создать форму регистрации в гравитационных формах, которая использует поле списка, чтобы сразу несколько человек могли зарегистрироваться. Проблема в том, что мне также нужно узнать количество подписчиков, чтобы я мог взимать плату за каждого.

С JS, как бы подсчитать количество строк в списке и передать значение в другое поле? Или есть лучший способ сделать это?

ОБНОВИТЬ:

Основываясь на ответе Obsidian Age, он периодически обновляется и выводит в поле количества:

function updateQty() {
    var rows = document.querySelectorAll('.gfield_list_group').length; // Count rows
    var qty = document.querySelector('.ginput_quantity'); // Define output location
    qty.value = rows; // Put row count in location
    setTimeout(updateQty, 2000); // Repeat every 2 seconds
}
updateQty(); // Execute

Answer 1

Я не знаком с выводимой разметкой конкретного плагина, но вы можете просто взять все нужные элементы с помощью чего-то вроде .querySelectorAll(), Отсюда легко определить их количество, просто запросив их .length, Если вы присвоите этот номер переменной, вы можете ссылаться на него позже, когда захотите вставить его обратно в другое поле - что можно сделать, обновив элемент .innerHTML с переменной.

Это можно увидеть в следующем:

const amount = document.querySelectorAll('.row').length;
const output = document.querySelector('.output');
output.innerHTML = amount;

<div class="row">One</div>
<div class="row">Two</div>
<div class="row">Three</div>
<div class="row">Four</div>
<br />
<div class="output"></div>

Answer 2

      <script>
jQuery.expr[':'].hasValue = function(el, index, match) {
  return el.value != "";
};
    
function updateQty() {
    var listFieldID = '#field_85_12 .gfield_list_12_cell1 input:hasValue';
    var totalFieldID = '#input_85_35';
    
    var totalRows = $(listFieldID).length; // Count rows
    var totalField = $(totalFieldID);

    console.log(totalRows); // For testing

    $( totalField ).val( totalRows +1 ).change();
    setTimeout(updateQty, 3000); // Repeat every 2 seconds
}
updateQty(); // Execute 

</script>