Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Прайс-калькулятор каждой строки в таблице (https://javascript.ru/forum/dom-window/54483-prajjs-kalkulyator-kazhdojj-stroki-v-tablice.html)

ReeQx 19.03.2015 05:39

Прайс-калькулятор каждой строки в таблице
 
Есть таблица, очень большая, с прайсом услуг.

<table width="100%" border="0" cellspacing="2" cellpadding="2">
<thead>
<th>Предмет</th>
<th>В наличии</th>
<th>Цена</th>
<th>Кол-во</th>
<th>Общая цена</th>
</thead>
<tr>
<td>ручка гелевая</td>
<td>40шт</td>
<td id="cena">5</td>
<td><input id="colvo" onkeyup="summ()"></td>
<td><div id="result"></div></td>
</tr>
<tr>
<td>ручка шариковая</td>
<td>40шт</td>
<td id="cena">10</td>
<td><input id="colvo" onkeyup="summ()"></td>
<td><div id="result"></div></td>
</tr>
</table>
Как можно подсчитывать суммы отдельных строк, не объявляя при этом для каждой из них свою переменную. Еще раз повторюсь ОЧЕНЬ большая таблица

laimas 19.03.2015 05:51

Ну вам же просчет нужно только той строки, в которой производится выбор, так ведь?

ReeQx 19.03.2015 05:56

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

laimas 19.03.2015 06:01

А что означает 40шт.? Это единица измерения цены, то есть 10 у.е. за 40 шт.?

ReeQx 19.03.2015 06:04

нет, простите за лишний код, это можно не учитывать, это значение показывает сколько товара в наличии

ReeQx 19.03.2015 06:07

вот для наглядного примера http://learn.javascript.ru/play/O2Z5lb

laimas 19.03.2015 06:46

Не могут N-элементов на странице иметь одно и тоже id. ID - это уникальный идентификатор. И в стилях надо описывать и не старье. На jQuery:

<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
<style>
table {
    border-collapse: separate;
    width: 100%;
    /* etc */
}

th {
    background: #eee;
    padding:  8px;
}

td {
    padding: 8px;
    border: 1px solid #eee;
}
</style> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script> 
$(function() {
    $('#as_name').on('keyup', 'input', function() {
        var p = $(this.parentNode);
        p.next().text(this.value.replace(/\D/, '')*1 * p.prev().text().replace(/\D/, '')*1)
    })
});
</script>     
</head> 

<body>
<table id="as_name">
    <thead>
        <th>Предмет</th>
        <th>В наличии</th>
        <th>Цена</th>
        <th>Кол-во</th>
        <th>Общая цена</th>
    </thead>
    <tr>
        <td>ручка гелевая</td>
        <td>40шт</td>
        <td>5</td>
        <td><input /></td>
        <td></td>
    </tr>
    <tr>
        <td>ручка шариковая</td>
        <td>40шт</td>
        <td>10</td>
        <td><input /></td>
        <td></td>
    </tr>
</table>
</body> 
</html>


Или не используется он, судя по примеру?

ReeQx 19.03.2015 07:59

Спасибо большое! Еще вопрос, как потом общую сумму вывести?

laimas 19.03.2015 11:33

Можно вывести и общую сумму, но ОЧЕНЬ большая это ОЧЕНЬ сколько? Очень большую не представляю на странице, кто же такую выдержит, но кто его знает, а вдруг, и придется CUDA подключать )

ReeQx 20.03.2015 01:32

там строк 400 примерно в сумме, на странице несколько таблиц


Часовой пояс GMT +3, время: 00:12.