Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Как заставить итоговую цифру... (https://javascript.ru/forum/dom-window/20664-kak-zastavit-itogovuyu-cifru.html)

sergiocharm 12.08.2011 21:58
Как заставить итоговую цифру...
 
Как заставить итоговую цифру округляться до сотых?

<script type="text/javascript">
<!--
function addIt() {
a=0.115;
var value1 = parseFloat(document.getElementById("inputA").value .replace(/,/, '.')) || 0;
// <---
// <---
document.getElementById("output").value = value1*a;
}
// -->
</script>

<h4>Объем воды в различных трубопроводах</h4>
Трубопровод металлопластиковый
<table border="1" class="forms">
<tr>
<td><strong>Диаметр трубопровода</strong></td>
<td><strong>Метраж (м.)</strong></td>
<td><strong>Объем (л.)</strong></td>
</tr>
<td><strong>16</strong></td>
<td>
<input type="text" name="inputA" id="inputA" value="0" size="10" onKeyUp="addIt();"/>
</td>
<td>
<input type="text" name="output" id="output" size="8" />
</td>
</tr>
</table>

devote 12.08.2011 22:00
блин, может уже научимся код в специальные теги обрамлять... в этой каше честно говоря сложно разобраться.

devote 12.08.2011 22:01 
document.getElementById("output").value = parseFloat(value1*a).toFixed(2);

sergiocharm 12.08.2011 22:07
ещё вопрос, в данной таблице одна строка расчитывает диаметр 16, но у меня ещё и другие диаметры будут (20,26,32), как должна выглядеть функция?... у меня сейчас создано несколько диаметров, но считает он почему то в последнюю ячейку

sergiocharm 12.08.2011 22:54
Так что же я делаю не так?
для каждой строки отдельную функцию что ли писать?
Подскажите плиз

function addIt() {  
  a=0.115;
  b=0.200; 
  c=0.315;
  d=0.530;
  var value1 = parseFloat(document.getElementById("inputA").value.replace(/,/, '.')) || 0;
 // <---  
 // <---  
 document.getElementById("outputA").value = value1*a;
 document.getElementById("outputA").value = parseFloat(value1*a).toFixed(2);
  document.getElementById("outputB").value = value1*b;
 document.getElementById("outputB").value = parseFloat(value1*b).toFixed(2);
  document.getElementById("outputC").value = value1*c;
 document.getElementById("outputC").value = parseFloat(value1*c).toFixed(2);
  document.getElementById("outputD").value = value1*d;
 document.getElementById("outputD").value = parseFloat(value1*d).toFixed(2);
}  
 // -->


<h4>Объем воды в различных трубопроводах</h4>
Трубопровод металлопластиковый
<table border="1" class="forms">
<tr>
<td><strong>Диаметр трубопровода</strong></td>
<td><strong>Метраж (м.)</strong></td>
<td><strong>Объем (л.)</strong></td>
</tr>
<td><strong>16</strong></td>
<td>
<input type="text" name="inputA" id="inputA" value="0" size="10" onKeyUp="addIt(1);"/>
</td>
<td>
<input type="text" name="outputA" id="outputA" size="8" />
</td>
</tr>
<tr>
<td><strong>20</strong></td>
<td>
<input type="text" name="inputB" id="inputB" value="0" size="10" onKeyUp="addIt(2);"/>
</td>
<td>
<input type="text" name="outputB" id="outputB" size="8" />
</td>
</tr>
<tr>
<td><strong>26</strong></td>
<td>
<input type="text" name="inputC" id="inputC" value="0" size="10" onKeyUp="addIt();"/>
</td>
<td>
<input type="text" name="outputC" id="outputC" size="8" />
</td>
</tr>
<tr>
<td><strong>32</strong></td>
<td>
<input type="text" name="inputD" id="inputD" value="0" size="10" onKeyUp="addIt();"/>
</td>
<td>
<input type="text" name="outputD" id="outputD" size="8" />
</td>
</tr>
</table>

sergiocharm 12.08.2011 22:59
нашел решение... Проблема только в том что при вводе в любую строку кол-во метров высчитывает правильно но появляются ранее отсутствующие нули, как бы не эстетично смотрится, как сделать так чтобы нули в других ячейках не появлялись?
<!--  
  function addIt() {  
  a=0.115;
  b=0.200; 
  c=0.315;
  d=0.530;
  var value1 = parseFloat(document.getElementById("inputA").value.replace(/,/, '.')) || 0;
    var value2 = parseFloat(document.getElementById("inputB").value.replace(/,/, '.')) || 0;
	  var value3 = parseFloat(document.getElementById("inputC").value.replace(/,/, '.')) || 0;
	    var value4 = parseFloat(document.getElementById("inputD").value.replace(/,/, '.')) || 0;
 // <---  
 // <---  
 document.getElementById("outputA").value = value1*a;
 document.getElementById("outputA").value = parseFloat(value1*a).toFixed(2);
  document.getElementById("outputB").value = value2*b;
 document.getElementById("outputB").value = parseFloat(value2*b).toFixed(2);
  document.getElementById("outputC").value = value3*c;
 document.getElementById("outputC").value = parseFloat(value3*c).toFixed(2);
  document.getElementById("outputD").value = value4*d;
 document.getElementById("outputD").value = parseFloat(value4*d).toFixed(2);
}  
 // -->



<h4>Объем воды в различных трубопроводах</h4>
Трубопровод металлопластиковый
<table border="1" class="forms">
<tr>
<td><strong>Диаметр трубопровода</strong></td>
<td><strong>Метраж (м.)</strong></td>
<td><strong>Объем (л.)</strong></td>
</tr>
<td><strong>16</strong></td>
<td>
<input type="text" name="inputA" id="inputA" value="0" size="10" onKeyUp="addIt();"/>
</td>
<td>
<input type="text" name="outputA" id="outputA" size="8" />
</td>
</tr>
<tr>
<td><strong>20</strong></td>
<td>
<input type="text" name="inputB" id="inputB" value="0" size="10" onKeyUp="addIt();"/>
</td>
<td>
<input type="text" name="outputB" id="outputB" size="8" />
</td>
</tr>
<tr>
<td><strong>26</strong></td>
<td>
<input type="text" name="inputC" id="inputC" value="0" size="10" onKeyUp="addIt();"/>
</td>
<td>
<input type="text" name="outputC" id="outputC" size="8" />
</td>
</tr>
<tr>
<td><strong>32</strong></td>
<td>
<input type="text" name="inputD" id="inputD" value="0" size="10" onKeyUp="addIt();"/>
</td>
<td>
<input type="text" name="outputD" id="outputD" size="8" />
</td>
</tr>
</table>

sergiocharm 13.08.2011 08:26
доброе утро всем....
подскажите как от нулей избавиться (при расчете в одной строке в другие ячейки автоматом нули проставляются) в вышеуказанном коде

devote 13.08.2011 08:52 
<script type="text/javascript">
  function addIt( type ) {
    var data = {
      A: 0.115,
      B: 0.200,
      C: 0.315,
      D: 0.530
    }

    var value = parseFloat(document.getElementById("input" + type).value.replace(/,/, '.')) || 0;
    document.getElementById("output" + type).value = parseFloat(value * data[ type ]).toFixed(2);
  }
</script>
<h4>Объем воды в различных трубопроводах</h4>
Трубопровод металлопластиковый
<table border="1" class="forms">
<tr>
  <td><strong>Диаметр трубопровода</strong></td>
  <td><strong>Метраж (м.)</strong></td>
  <td><strong>Объем (л.)</strong></td>
</tr>
  <td><strong>16</strong></td>
  <td>
    <input type="text" name="inputA" id="inputA" value="0" size="10" onKeyUp="addIt('A');"/>
  </td>
  <td>
    <input type="text" name="outputA" id="outputA" size="8" />
  </td>
</tr>
<tr>
  <td><strong>20</strong></td>
  <td>
    <input type="text" name="inputB" id="inputB" value="0" size="10" onKeyUp="addIt('B');"/>
  </td>
  <td>
    <input type="text" name="outputB" id="outputB" size="8" />
  </td>
</tr>
<tr>
  <td><strong>26</strong></td>
  <td>
    <input type="text" name="inputC" id="inputC" value="0" size="10" onKeyUp="addIt('C');"/>
  </td>
  <td>
    <input type="text" name="outputC" id="outputC" size="8" />
  </td>
</tr>
<tr>
  <td><strong>32</strong></td>
  <td>
    <input type="text" name="inputD" id="inputD" value="0" size="10" onKeyUp="addIt('D');"/>
  </td>
  <td>
    <input type="text" name="outputD" id="outputD" size="8" />
  </td>
</tr>
</table>

sergiocharm 13.08.2011 10:43
вставляю всё что у вас написано на страницу, почему то не считает :nono: хотя в вашем примере все считает.. непонятно

sergiocharm 13.08.2011 11:03
какой то конфликт с Wordpress. Я скрипт и код вставляю во вкладку HTML, может здесь что то не так делаю?

sergiocharm 13.08.2011 11:05
разобрался!

sergiocharm 13.08.2011 11:13
Ребят, вопрос такой:
Как суммировать данные?
к примеру пользователь ввел 10м в 26 диаметре и 32 диаметре -20метров... http://www.allremont59.ru/obem-vodyi...oprovodah.html
Хочется чтобы под таблицей автоматом выводилась итоговая сумма литров (под каждой таблицей отдельно)

спасибо!

melky 13.08.2011 11:24
Цитата:
Сообщение от sergiocharm (Сообщение 120259)
Ребят, вопрос такой:
Как суммировать данные?
к примеру пользователь ввел 10м в 26 диаметре и 32 диаметре -20метров... http://www.allremont59.ru/obem-vodyi...oprovodah.html
Хочется чтобы под таблицей автоматом выводилась итоговая сумма литров (под каждой таблицей отдельно)

спасибо!
пройтись по всем полям и назначить обработчики onchange. потом делай с числами, что хочешь

селектор примерно такой (jq)

$("table.forms input[name ^= 'input'");

sergiocharm 14.08.2011 13:22
Цитата:
Хочется чтобы под таблицей автоматом выводилась итоговая сумма литров (под каждой таблицей отдельно)
вопрос остается открытым :(

melky 15.08.2011 00:15
скрипт что ли написать не можете?

sergiocharm 15.08.2011 00:36
Ну вот есть
<script type="text/javascript">
  function addIt( type ) {
    var data = {
      A: 0.115,
      B: 0.200,
      C: 0.315,
      D: 0.530,
  F:0.140,
  G:0.216, 
  H:0.352,
  J:0.555, 
      K: 0.176,
      L: 0.315,
      M: 0.490,
      N: 0.805,
  O:1.260,
  P:1.960, 
  R:3.7,
  S:5.3, 
  T:8  }
    var value = parseFloat(document.getElementById("input" + type).value.replace(/,/, '.')) || 0;
    document.getElementById("output" + type).value = parseFloat(value * data[ type ]).toFixed(2);
  }
</script>


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


вот таблица
<span style="text-decoration: underline;">Трубопровод металлопластиковый</span>
<table class="forms">
<tr>
<td align="center" width="250"><strong>Диаметр трубопровода</strong></td>
<td align="center" width="100"><strong>Метраж (м.)</strong></td>
<td align="center" width="100"><strong>Объем (л.)</strong></td>
</tr>
<td align="center"><strong>16</strong></td>
<td align="center"><input type="text" name="inputA" id="inputA" value="0" size="10" onKeyUp="addIt('A');"/></td>
<td align="center"><input type="text" name="outputA" id="outputA" size="8" /></td>
</tr>
<tr>
<td align="center"><strong>20</strong></td>
<td align="center"><input type="text" name="inputB" id="inputB" value="0" size="10" onKeyUp="addIt('B');"/></td>
<td align="center"><input type="text" name="outputB" id="outputB" size="8" /></td>
</tr>
<tr>
<td align="center"><strong>26</strong></td>
<td align="center"><input type="text" name="inputC" id="inputC" value="0" size="10" onKeyUp="addIt('C');"/></td>
<td align="center"><input type="text" name="outputC" id="outputC" size="8" /></td>
</tr>
<tr>
<td align="center"><strong>32</strong></td>
<td align="center"><input type="text" name="inputD" id="inputD" value="0" size="10" onKeyUp="addIt('D');"/></td>
<td align="center"><input type="text" name="outputD" id="outputD" size="8" /></td>
</tr>
</table>

<span style="text-decoration: underline;">Трубопровод Полипропиленовый PN 20</span>
<table class="forms">
<tr>
<td align="center" width="250"><strong>Диаметр трубопровода</strong></td>
<td align="center" width="100"><strong>Метраж (м.)</strong></td>
<td align="center" width="100"><strong>Объем (л.)</strong></td>
</tr>
<td align="center"><strong>16</strong></td>
<td align="center"><input type="text" name="inputF" id="inputF" value="0" size="10" onKeyUp="addIt('F');"/></td>
<td align="center"><input type="text" name="outputF" id="outputF" size="8" /></td>
</tr>
<tr>
<td align="center"><strong>20</strong></td>
<td align="center"><input type="text" name="inputG" id="inputG" value="0" size="10" onKeyUp="addIt('G');"/></td>
<td align="center"><input type="text" name="outputG" id="outputG" size="8" /></td>
</tr>
<tr>
<td align="center"><strong>26</strong></td>
<td align="center"><input type="text" name="inputH" id="inputH" value="0" size="10" onKeyUp="addIt('H');"/></td>
<td align="center"><input type="text" name="outputH" id="outputH" size="8" /></td>
</tr>
<tr>
<td align="center"><strong>32</strong></td>
<td align="center"><input type="text" name="inputJ" id="inputJ" value="0" size="10" onKeyUp="addIt('J');"/></td>
<td align="center"><input type="text" name="outputJ" id="outputJ" size="8" /></td>
</tr>
</table>

<span style="text-decoration: underline;">Трубопровод стальной ВГП</span>
<table class="forms">
<tr>
<td align="center" width="250"><strong>Диаметр трубопровода (Ду)</strong></td>
<td align="center" width="100"><strong>Метраж (м.)</strong></td>
<td align="center" width="100"><strong>Объем (л.)</strong></td>
</tr>
<td align="center"><strong>15*2,8мм</strong></td>
<td align="center"><input type="text" name="inputK" id="inputK" value="0" size="10" onKeyUp="addIt('K');"/></td>
<td align="center"><input type="text" name="outputK" id="outputK" size="8" /></td>
</tr>
<tr>
<td align="center"><strong>20*2,8мм</strong></td>
<td align="center"><input type="text" name="inputL" id="inputL" value="0" size="10" onKeyUp="addIt('L');"/></td>
<td align="center"><input type="text" name="outputL" id="outputL" size="8" /></td>
</tr>
<tr>
<td align="center"><strong>25*3,2мм</strong></td>
<td align="center"><input type="text" name="inputM" id="inputM" value="0" size="10" onKeyUp="addIt('M');"/></td>
<td align="center"><input type="text" name="outputM" id="outputM" size="8" /></td>
</tr>
<tr>
<td align="center"><strong>32*3,2мм</strong></td>
<td align="center"><input type="text" name="inputN" id="inputN" value="0" size="10" onKeyUp="addIt('N');"/></td>
<td align="center"><input type="text" name="outputN" id="outputN" size="8" /></td>
</tr>
<tr>
<td align="center"><strong>40*3,5мм</strong></td>
<td align="center"><input type="text" name="inputO" id="inputO" value="0" size="10" onKeyUp="addIt('O');"/></td>
<td align="center"><input type="text" name="outputO" id="outputO" size="8" /></td>
</tr>
<tr>
<td align="center"><strong>50*3,5мм</strong></td>
<td align="center"><input type="text" name="inputP" id="inputP" value="0" size="10" onKeyUp="addIt('P');"/></td>
<td align="center"><input type="text" name="outputP" id="outputP" size="8" /></td>
</tr>
<tr>
<td align="center"><strong>76*3,5мм</strong></td>
<td align="center"><input type="text" name="inputR" id="inputR" value="0" size="10" onKeyUp="addIt('R');"/></td>
<td align="center"><input type="text" name="outputR" id="outputR" size="8" /></td>
</tr>
<tr>
<td align="center"><strong>89*3,5мм</strong></td>
<td align="center"><input type="text" name="inputS" id="inputS" value="0" size="10" onKeyUp="addIt('S');"/></td>
<td align="center"><input type="text" name="outputS" id="outputS" size="8" /></td>
</tr>
<tr>
<td align="center"><strong>108*4мм</strong></td>
<td align="center"><input type="text" name="inputT" id="inputT" value="0" size="10" onKeyUp="addIt('T');"/></td>
<td align="center"><input type="text" name="outputT" id="outputT" size="8" /></td>
</tr>
</table>

devote 15.08.2011 11:34 
function addIt( type ) {
    var data = {
      A: 0.115,
      B: 0.200,
      C: 0.315,
      D: 0.530,
  F:0.140,
  G:0.216, 
  H:0.352,
  J:0.555, 
      K: 0.176,
      L: 0.315,
      M: 0.490,
      N: 0.805,
  O:1.260,
  P:1.960, 
  R:3.7,
  S:5.3, 
  T:8  }
    var value = parseFloat(document.getElementById("input" + type).value.replace(/,/, '.')) || 0;
    document.getElementById("output" + type).value = parseFloat(value * data[ type ]).toFixed(2);

    var total = 0;
    for(var key in data) {
        total += parseFloat(document.getElementById("input" + key).value.replace(/,/, '.')) || 0;
    }
    document.getElementById("total_box").value = total;
  }

sergiocharm 15.08.2011 15:34
эмммм... а как в тело вставить?

sergiocharm 15.08.2011 20:32
Пока не забанили... благодарю за помощь: devote, devote и ещё раз devote, а так же melky, ну и тех кто пытался помочь...

devote 15.08.2011 22:08
Цитата:
Сообщение от sergiocharm
Пока не забанили...
а что должны?

sergiocharm 15.08.2011 22:49
ну да:) ... обвиняют меня тут http://javascript.ru/forum/job/20678...ogrammist.html
devote,
подскажи всё таки как поле total_box вставить ? а главное правильно... Плиз

sergiocharm 15.08.2011 22:51
у меня щас он метры суммирует http://www.allremont59.ru/obem-vodyi...oprovodah.html, а как сделать чтобы литры суммировал?

sergiocharm 15.08.2011 23:03
добавил в конце каждой таблички 
<tr>
<td align="center"><strong>Всего воды</strong></td> 
<td align="center"></td>
<td align="center"><input name="total_box" id="total_box" size="8"/></td>
</tr>

теперь при вводе суммирует (метры, но не литры) в первую таблицу))), что не так?

devote 16.08.2011 00:09 
var total_m = 0,
    total_l = 0;
    for(var key in data) { 
        total_m += parseFloat(document.getElementById("input" + key).value.replace(/,/, '.')) || 0; 
        total_l += parseFloat(document.getElementById("output" + key).value.replace(/,/, '.')) || 0; 
    } 
    document.getElementById("total_box_m").value = total;
    document.getElementById("total_box_l").value = total;

devote 16.08.2011 00:12
ох ё, у тебя там 6 полей должно быть с общей суммой чтоль?

devote 16.08.2011 00:25 
var k, i, total_m, total_l ,
    boxes = [
      ['A', 'B', 'C', 'D'],
      ['F', 'G', 'H', 'J'],
      ['K', 'L', 'M', 'N', 'O', 'P', 'R', 'S', 'T']
    ];

for( k = 0; k < boxes.length; k++ ) {
    total_m = 0;
    total_l = 0;
    for( i = 0; i < boxes[ k ].length; i++ ) {
        total_m += parseFloat(document.getElementById("input" + boxes[ k ][ i ]).value.replace(/,/, '.')) || 0;
        total_l += parseFloat(document.getElementById("output" + boxes[ k ][ i ]).value.replace(/,/, '.')) || 0;
    }
    document.getElementById("total_box" + k + "_m").value = total_m;
    document.getElementById("total_box" + k + "_l").value = total_l;
}



<input id="total_box0_m" size="8"/>
<input id="total_box0_l" size="8"/>

<input id="total_box1_m" size="8"/>
<input id="total_box1_l" size="8"/>

<input id="total_box2_m" size="8"/>
<input id="total_box2_l" size="8"/>

sergiocharm 16.08.2011 01:40
я так понимаю пришлось целый массив создавать

NoNickName 26.03.2017 15:15
Цитата:
Сообщение от sergiocharm (Сообщение 120226)
доброе утро всем....
подскажите как от нулей избавиться (при расчете в одной строке в другие ячейки автоматом нули проставляются) в вышеуказанном коде
 
function floorToDigit(dig, acc){
return Math.round(dig/acc)*acc
}
//Возвращает число, округленное с шагом acc
//То есть если мы введем floorToDigit(13, 5) то она нам вернет 15
//
//10 5 => 10
//1 7 => 1
//5 7 => 7
//7 7 => 7


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