Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 24.09.2015, 21:23
Интересующийся
Отправить личное сообщение для Георгий М. Посмотреть профиль Найти все сообщения от Георгий М.
 
Регистрация: 24.09.2015
Сообщений: 13

Калькулятор для расчета стоимости на сайте
Добрый день, уважаемые форумчане.
Есть задача разработать калькулятор на сайт.
Есть поле куда можно вписать длину и ширину тем самым получить площадь. Затем в зависимости от выбранных галочек radio эта площадь умножается на цену. Таких галочек radio 2 группы - в зависимости от типа и в зависимости от толщины. Однако калькулятор работает лишь с одной группой галочек, добавляя к ней другую группу галочек, он выдавать результат отказывается. Нужна ваша помощь, заранее благодарю.

<body>

<b> ширина:</b>  <input id="shir" type="text" value="5" /> <b>M<sup>2</sup></b>
<b> длина:</b>  <input id="dlin" type="text" value="5" /> <b>M<sup>2</sup></b>

<form id="form" name="form">

<div class="calc-bgarea">

<b> Выберите тип:</b>
<input type="radio" id="color1" name="cena" value="12000" checked />Стандарт

<input type="radio" id="color2" name="cena" value="13000" />Цвет<br/>

<input type="radio" id="color3" name="cena" value="14000" />Стекляшки

<input type="radio" id="color4" name="cena" value="15000" />Плитка

<b> толщина</b>
<input type="radio" id="tolsh1" name="toshina" value="1" checked />Стандарт

<input type="radio" id="tolsh2" name="toshina" value="1000" />Цвет<br/>

<input type="radio" id="tolsh3" name="toshina" value="2000" />Стекляшки

<input type="radio" id="tolsh3" name="toshina" value="3000" />Плитка


</div>
<div class="calc-bg2">
пример сообщени
</div>

<div class="calc-bgtotal">
Итого: <span id="result">0</span> руб.<br>
</div>
</form>

[JS]

<script>

document.body.onload = function() {
 
    function calc() {
        var d = document, price = tolshi = 0;
        shir1 = +d.getElementById("shir").value,
		dlin1 = +d.getElementById("dlin").value,
        sq = Math.ceil(shir1 * dlin1 / 1000000),
        color1 = d.getElementById("color1"),

        color2 = d.getElementById("color2"),

        color3 = d.getElementById("color3"),

        color4 = d.getElementById("color4"),
		
		tolsh1 = d.getElementById("tolsh1"),

        tolsh2 = d.getElementById("tolsh2"),

        tolsh3 = d.getElementById("tolsh3"),

        tolsh4 = d.getElementById("tolsh4"),

        result = d.getElementById("result"),

        kol = d.getElementById("kol");

        if (color1.checked) price = +color1.value;

        if (color2.checked) price = +color2.value;

        if (color3.checked) price = +color3.value;

        if (color4.checked) price = +color4.value;
		
		if (tolsh1.checked) tolshi = +tolsh1.value;

        if (tolsh2.checked) tolshi = +tolsh2.value;

        if (tolsh3.checked) tolshi = +tolsh3.value;

        if (tolsh4.checked) tolshi = +tolsh4.value;

        result.innerHTML = Math.ceil(sq * (price + tolshi));

    };

    document.form.onchange = calc;

    document.getElementById("shir").oninput = calc;

    calc();

 

}
</script>
[/JS]
</body>

Последний раз редактировалось Георгий М., 24.09.2015 в 21:40.
Ответить с цитированием
  #2 (permalink)  
Старый 25.09.2015, 08:33
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,215

Георгий М., ты явно говнокодишь...
Просто заплати за тот калькулятор и будет тебе счастие.
Ответить с цитированием
  #3 (permalink)  
Старый 25.09.2015, 09:21
Аватар для EmperioAf
Профессор
Отправить личное сообщение для EmperioAf Посмотреть профиль Найти все сообщения от EmperioAf
 
Регистрация: 15.01.2015
Сообщений: 622

Сообщение от Георгий М.
<input type="radio" id="tolsh3" name="toshina" value="2000" />Стекляшки
 
<input type="radio" id="tolsh3" name="toshina" value="3000" />Плитка
у вас нет элемента с id="tolsh4" и поэтому эта строка : if (tolsh4.checked) tolshi = +tolsh4.value;
выдаёт ошибку
Открывайте консоль каждый раз, когда что то не работает.
Ответить с цитированием
  #4 (permalink)  
Старый 25.09.2015, 11:28
Интересующийся
Отправить личное сообщение для Георгий М. Посмотреть профиль Найти все сообщения от Георгий М.
 
Регистрация: 24.09.2015
Сообщений: 13

Сообщение от EmperioAf Посмотреть сообщение
у вас нет элемента с id="tolsh4" и поэтому эта строка : if (tolsh4.checked) tolshi = +tolsh4.value;
выдаёт ошибку
Открывайте консоль каждый раз, когда что то не работает.
Благодарю за ответ, очень помогло.
Ответить с цитированием
  #5 (permalink)  
Старый 25.09.2015, 11:40
Аватар для EmperioAf
Профессор
Отправить личное сообщение для EmperioAf Посмотреть профиль Найти все сообщения от EmperioAf
 
Регистрация: 15.01.2015
Сообщений: 622

Сообщение от ksa
Георгий М., ты явно говнокодишь...
калькулятор там небось стилизован так, что пользователь об этом и не догадывается
Ответить с цитированием
  #6 (permalink)  
Старый 25.09.2015, 13:42
hhh hhh вне форума
Профессор
Отправить личное сообщение для hhh Посмотреть профиль Найти все сообщения от hhh
 
Регистрация: 19.11.2013
Сообщений: 150

tolshi
Ответить с цитированием
  #7 (permalink)  
Старый 25.09.2015, 15:23
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,215

Сообщение от EmperioAf
калькулятор там небось стилизован так, что пользователь об этом и не догадывается
Я на код его смотрю, не на внешний вид...
Ответить с цитированием
  #8 (permalink)  
Старый 06.05.2016, 18:22
Новичок на форуме
Отправить личное сообщение для webgroupco Посмотреть профиль Найти все сообщения от webgroupco
 
Регистрация: 06.05.2016
Сообщений: 1

Здравствуйте!

Сделали такой вариант в сочетании с RSForm
Скрипт считает значения value

Код Java (замените переменные на свои)

<script type="text/javascript">
/*
* Функция подсчета стоимости услуг на создания дизайна сайта
*/
function calc() {
//получаем ссылку на элемент Select (Тип дизайна)
var category = document.getElementById("category");
var shablon = document.getElementById("shablon");
var zapolnenie = document.getElementById("zapolnenie");
var logo = document.getElementById("logo");
var design = document.getElementById("design");
var language = document.getElementById("language");
var contentsite = document.getElementById("contentsite");
var mobile = document.getElementById("mobile");



//получаем ссылку на чекбокс (Требуется верстка?)
var modules0 = document.getElementById("modules0");
var modules1 = document.getElementById("modules1");
var modules2 = document.getElementById("modules2");
var modules3 = document.getElementById("modules3");
var modulestoo0 = document.getElementById("modulestoo0");
var modulestoo1 = document.getElementById("modulestoo1");
var modulestoo2 = document.getElementById("modulestoo2");
var modulestoo3 = document.getElementById("modulestoo3");


//получаем ссылку на элемент span, в него будем писать стоимость дизайна
var result = document.getElementById("result");

var price = 0;
price += parseInt(category.options[category.selectedIndex].value);
price += parseInt(shablon.options[shablon.selectedIndex].value);
price += parseInt(zapolnenie.options[zapolnenie.selectedIndex].value);
price += parseInt(logo.options[logo.selectedIndex].value);
price += parseInt(design.options[design.selectedIndex].value);
price += parseInt(language.options[language.selectedIndex].value);
price += parseInt(contentsite.options[contentsite.selectedIndex].value);
price += parseInt(mobile.options[mobile.selectedIndex].value);

price += (modules0.checked == true)? parseInt(modules0.value) : 0;
price += (modules1.checked == true)? parseInt(modules1.value) : 0;
price += (modules2.checked == true)? parseInt(modules2.value) : 0;
price += (modules3.checked == true)? parseInt(modules3.value) : 0;
price += (modulestoo0.checked == true)? parseInt(modulestoo0.value) : 0;
price += (modulestoo1.checked == true)? parseInt(modulestoo1.value) : 0;
price += (modulestoo2.checked == true)? parseInt(modulestoo2.value) : 0;
price += (modulestoo3.checked == true)? parseInt(modulestoo3.value) : 0;



result.innerHTML = price;
}

</script>


<div id="calc-summa-text">Стоимость разработки сайта: <span id="result">0</span> $.</div>


Рабочий пример этого калькулятора https://webgroupco.com/create-site/k...toimosti-sajta
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Калькулятор стоимости из 3 массивов. sergiocharm Работа 2 21.03.2014 23:01
Решение проблемы кодировок для AJAX и PHP без iconv (cp1251 в AJAX) Serge Ageyev AJAX и COMET 10 24.04.2013 20:48
Новая система управления сайтом Scripto CMS deepslam Ваши сайты и скрипты 38 31.01.2011 14:55
Калькулятор расчета полиграфии 120gramm Общие вопросы Javascript 1 25.09.2010 15:44