Как создать функцию «суммирования» OnChange из неизвестного числа текстовых полей - PullRequest
1 голос
/ 12 ноября 2010

У меня возникают проблемы с выяснением, как выполнить простую задачу Javascript для полей в таблице, созданной с помощью Rails 3.

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

Количество столбцов в таблице основано на количестве атрибутов, представленных в другой форме.Независимо от того, сколько столбцов в строке, после них также есть столбец Всего.Каждая ячейка в таблице имеет входное поле text_field с идентификатором, основанным на идентификаторе объекта строки и идентификаторе объекта столбца.

Я пытаюсь создать событие OnChange для каждой из этих ячеек., поэтому, когда значение поля изменяется, столбец Total обновляется с общим значением во входных данных text_field всех ячеек в этой строке.

Я не знаю, как передать объекты Rails в Javascript (поэтомуЯ могу циклически перебирать идентификаторы), я не могу понять, как получить имена и значения элементов DOM, если я использую действие в контроллере, и я не знаю, как использовать RJS для этого.Кто-нибудь может предложить какую-либо помощь, как это сделать?Спасибо!

Сара

Ответы [ 2 ]

1 голос
/ 12 ноября 2010

В jQuery было бы легко перебирать все элементы с одним и тем же классом, поэтому здесь поможет правильный дизайн вашего документа.

Может быть, что-то вроде этого:

 $('.thing_to_change').live('change', function() { retotal(); });

Ваша функция суммирования может быть аналогичной:

 var total = 0;
 $('.thing_to_change').each(function() { total = total + $(this).val() });
1 голос
/ 12 ноября 2010

Если вы используете jQuery, вы можете установить класс для текстовых полей и прослушать событие изменения в нем.

пример:

<input type="text" id="WhateverXXX" class="MyValue" />

<script type="text/javascript">
    $(function(e) {
        $('.MyValue').change(function(e) {
            // update the total
        });
    });
</script>
...