VPF::Обработка числового поля - Форум программистов

zheka1980

Дата 29.12.2014, 20:22 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 42
Регистрация: 3.8.2014

Репутация: нет
Всего: нет

Господа, есть несколько полей

Код


<input type="text" name="component" value="0">

Этим полям присваивается какое-то значение типа float.

А есть еще одно поле

Код


<input type="text" name="summary" value="0">

Нужно сложить значения всех полей component и записать в поле summary. Причем по техническим причинам это нужно делать только в цикле, то есть вариант summary=component[1]+component[2]+.... не пойдет. Нужно в цикле к summary прибавалять component[i].
А поскольку поле текстовое, я вынужден каждый раз брать данные, обрабатывать их функцией Number, затем складывать, затем записывать.

Код


for (i=0; i<$('.field').size(); i++) 
                {
                 document.getElementsByName('summary')[0].value=Number(document.getElementsByName('summary')[0].value)+Number(document.getElementsByName('component'));

                }

Работает, но меня не покидает ощущение, что я нагородил чего-то. Нельзя ли как-то проще? МОжно ли сразу input придать только цифровой тип? Я натыкался на информацию о такой возможности, но пишут, то вроде бы не все браузеры подерживают.

sQu1rr

Дата 29.12.2014, 23:24 (ссылка)

(нет голосов)

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 597
Регистрация: 11.11.2008
Где: london

Репутация: 2
Всего: 13

Цитата(zheka1980 @ 29.12.2014, 17:22

)

не покидает ощущение, что я нагородил чего-то

Да вроде все верно.
Только вместо Number() я бы использовал parseFloat() ну и DOM лишний раз трогать не стоит. Создайте временную переменную, туда считайте результат, а потом ее запишите в DOM.
Ну и разумеется все getElementBy нужно во временную переменную, что бы каждый раз не искать, то же самое и с $('.field').size(). Да и если используете jquery что вам мешает написать $('...').get(i).value??

Добавлено через 7 минут и 31 секунду
Что-то вроде (НЕ ПРОВЕРЯЛ, считайте что это псевдокод)

Код


var summary = 0;
$('.field').each(function() {
    summary += parseFloat($(this).find("[name='component']").val());
});
$("[name='summary']").val(summary);

Это сообщение отредактировал(а) sQu1rr - 29.12.2014, 23:27

zheka1980

Дата 30.12.2014, 04:37 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 42
Регистрация: 3.8.2014

Репутация: нет
Всего: нет

Цитата

Да и если используете jquery что вам мешает написать $('...').get(i).value??

Вместо чего? В приведенном вами примере данной конструкции не увидел.

Я только начал вникать в jquery

Неужели это операция присваивания?

Цитата

$("[name='summary']").val(summary);

Aliance

Дата 30.12.2014, 08:35 (ссылка)

(нет голосов)

Загрузка ...

I ♥ <script>

Профиль
Группа: Модератор
Сообщений: 6418
Регистрация: 2.8.2004
Где: spb

Репутация: 17
Всего: 137

Цитата(zheka1980 @ 30.12.2014, 05:37

)

Вместо чего?

имелось ввиду, раз уже у вас подключена библиотека jQuery, то разумнее все выборки делать в ней (вместо вашего варианта с getElementsByName).

Цитата(zheka1980 @ 30.12.2014, 05:37

)

Неужели это операция присваивания?

Да. jQuery.val()

Только я бы не рекомендовал делать выборку по атрибуту там, где этого можно не делать - все же она не самая быстрая.

Код


$('.field').each(function() {
    $(this).find("[name='component']").val()
});
// можно заменить на
$('input.component').each(function() {
    $(this).val()
});
// добавив полям class="component"

PS: в HTML5 атрибут name помечен как deprecated, рекомендуется использовать id. Да и выборки по нему быстрее.

--------------------

• Все о событиях
• Объекты и массивы
• ОКНА И ФРЕЙМЫ

JAVA ≠ JavaScript

sQu1rr

Дата 30.12.2014, 12:19 (ссылка)

(нет голосов)

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 597
Регистрация: 11.11.2008
Где: london

Репутация: 2
Всего: 13

Цитата(Aliance @ 30.12.2014, 05:35

)

атрибут name помечен как deprecated

wut? только в <img> насколько я знаю, может еще где, но точно не в <input>.

Цитата(zheka1980 @ 30.12.2014, 01:37

)

Вместо чего?

Код


document.getElementsByName('component')[i] // который у вас написан неправильно

А вообще, да, не нужно придумывать велосипеды, и просто

Код


var summary = 0;
$('input.component').each(function() {
    summary += parseFloat( $(this).val() );
});
// добавив полям class="component"
$("#summary").val(summary); // предпологаем что summary это id, так как summary только один

как сказал мр. Aliance

Цитата(zheka1980 @ 30.12.2014, 01:37

)

Я только начал вникать в jquery

http://api.jquery.com/ - изучайте smile

Aliance

Дата 30.12.2014, 12:24 (ссылка)

(нет голосов)

Загрузка ...

I ♥ <script>

Профиль
Группа: Модератор
Сообщений: 6418
Регистрация: 2.8.2004
Где: spb

Репутация: 17
Всего: 137

Цитата(sQu1rr @ 30.12.2014, 13:19

)

wut? только в <img> насколько я знаю, может еще где, но точно не в <input>.

Цитата

Note: In HTML5, the "name" attribute is deprecated and has been replaced by the "id" attribute for many elements. Use the document.getElementById() method where it is appropriate. Also look at the getElementsByClassName() and getElementsByTagName() methods.

© http://www.w3schools.com/jsref/met_doc_getelementsbyname.asp

Добавлено через 3 минуты и 36 секунд
Да, текстовых полей это не касается

Цитата

11.2 Non-conforming features

Elements in the following list are entirely obsolete, and must not be used by authors:

name on a elements (except as noted in the previous section)
name on embed elements
name on img elements
name on option elements
Use the id attribute instead.

--------------------

• Все о событиях
• Объекты и массивы
• ОКНА И ФРЕЙМЫ

JAVA ≠ JavaScript

zheka1980

Дата 2.1.2015, 14:38 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 42
Регистрация: 3.8.2014

Репутация: нет
Всего: нет

Все получилось. Спасибо.
Осталась одна деталь, не могу никак правильно написать (какой-то синтаксис Jquery для меня вычурный, если честно)

Вот так я получал номер инпута, в котором возникло событие select библиотеки autocomplete:

Код


...
select: function(event, ui) 
           { 
             var element_index=$('.search').index(this);// ПОЛУЧИЛИ НОМЕР
             elem_ing_caloric=document.getElementsByName('ing_caloric'); // получили ссылку на INPUT в который нужно записать данные
             elem_ing_caloric[element_index].value=ui.item.caloric; // Записали данные

Так вот как мне теперь, минуя обращение к DOM средставми JavaScript присвоить значение инпуту?
Я заменил в инпуте nаmе=ing_caloric на class=ing_caloric и сделал так:

Код


$('.ing_caloric').eq('.search').index(this).val(ui.item.caloric);

Где-то ошибка...

Это сообщение отредактировал(а) Aliance - 11.1.2015, 10:23

Aliance

Дата 11.1.2015, 10:24 (ссылка)

(нет голосов)

Загрузка ...

I ♥ <script>

Профиль
Группа: Модератор
Сообщений: 6418
Регистрация: 2.8.2004
Где: spb

Репутация: 17
Всего: 137

Цитата(zheka1980 @ 2.1.2015, 15:38

)

$('.ing_caloric').eq('.search').index(this).val(ui.item.caloric);

вообще сплошная ошибка. опишите словами чего вы хотите добиться. а еще лучше с примером разметки на jsfiddle

--------------------

• Все о событиях
• Объекты и массивы
• ОКНА И ФРЕЙМЫ

JAVA ≠ JavaScript

0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| JavaScript: для новичков \| Следующая тема »