Всем доброго дня! Прошу помощи в оптимизации следующего кода.
<form id="city[*id*]" method="post" action="/">
<h2 class="h3">Трансфер Город - [*pagetitle*]</h2>
<!---Имя--->
<div class="form-group">
<div class="col-sm-6 col-xs-12">
<div class="input-group">
<span class="input-group-addon">
<i class="fa fa-fw fa-user"></i>
</span>
<input type="text" class="form-control" value="" name="name" placeholder="Ваше имя">
</div>
</div>
</div>
<!---/Имя--->
<div class="form-group">
<div class="col-sm-6 col-xs-12">
<div class="input-group">
<span class="input-group-addon">
<i class="fa fa-fw fa-home"></i>
</span>
<input name="address" class="form-control" placeholder="Адрес"></div>
</div>
</div>
<!---Клас авто--->
<div class="form-group">
<div class="col-sm-6 col-xs-12">
<div class="input-group">
<span class="input-group-addon">
<i class="fa fa-fw fa-car"></i>
</span>
<select onchange="calculate()" name="cartype" id="cartype" class="form-control">
<option value="1">Комфорт</option>
<option value="0.8571">Эконом</option>
<option value="1.1429">Минивэн</option>
<option value="1.2143">Бизнес</option>
<option value="2.2143">Микроавтобус</option>
</select>
<script>
function calculate()
{
var aa = [*price-city*];//базовая цена в(из) город(а) в byn
select = document.getElementById("cartype");
var car = select.options[select.selectedIndex].value;
var bb = [!currency-usd!];//курс usd
var cc = [!currency-euro!];//курс euro
var dd = [!currency-rub!];//курс рос.руб.
document.getElementById('price').innerHTML = '<span class="main-currency">Стоимость ' + Math.round(aa*car) + ' Руб.</span><span class="usd">' + Math.round((aa/bb)*car)+' USD</span><span class="euro">' + Math.round((aa/cc)*car) + ' EURO</span><span class="rub">' + Math.round((aa*100/dd)*car) + ' RUB</span>';
}
</script>
</div>
</div>
</div>
<!---/Класс авто--->
<!---Количество человек--->
<div class="form-group">
<div class="col-sm-6 col-xs-12">
<div class="input-group">
<span class="input-group-addon">
<i class="fa fa-fw fa-child"></i>
</span>
<input type="text" class="form-control" value="" name="count" placeholder="Количество человек (взрослые/дети)">
</div>
</div>
</div>
<!---/Количество человек--->
<!---дата и время--->
<div class="form-group">
<div class="col-sm-6 col-xs-12">
<div class="input-group">
<span class="input-group-addon">
<i class="fa fa-fw fa-clock-o"></i>
</span>
<input type="text" value="" name="date" placeholder="Дата и время" class="datepicker-here form-control" data-timepicker="true">
</div>
</div>
</div>
<!-------------/дата и время------------>
<!---Телефон--->
<div class="form-group">
<div class="col-sm-6 col-xs-12">
<div class="input-group">
<span class="input-group-addon">
<i class="fa fa-fw fa-phone"></i>
</span>
<input type="text" size="30" class="form-control" value="" name="phone" placeholder="Телефон">
</div>
</div>
</div>
<!---/Телефон--->
<!---E-mail--->
<div class="form-group">
<div class="col-sm-6 col-xs-12">
<div class="input-group">
<span class="input-group-addon">
<i class="fa fa-fw fa-envelope"></i>
</span>
<input type="text" class="form-control" value="" name="email" placeholder="E-mail">
</div>
</div>
</div>
<!---/E-mail--->
<div class="form-group">
<div class="col-sm-2 col-xs-12">
<div class="input-group">
<p class="control-label">Детское кресло
<select name="booster" id="booster" class="form-control">
<option vlaue="Нет">Нет</option>
<option vlaue="Да">Да</option>
</select>
</p>
</div>
</div>
<div class="col-sm-4 col-xs-12 no-padding">
<div class="input-group">
<p class="control-label">Безналичный расчёт (+5% от стоимости трансфера)
<select name="credit_card" id="credit_card" class="form-control">
<option vlaue="Да">Да</option>
<option vlaue="Нет">Нет</option>
</select>
</p>
</div>
</div>
</div>
<div class="form-group">
<div class="col-sm-12 col-xs-12">
<textarea name="description" class="form-control" rows="3" placeholder="Доп. информация"></textarea>
</div>
</div>
<div class="col-sm-12 col-xs-12 text-center"><div id="price"></div></div>
<div class="clear"></div>
<script>
var a = [*price-city*];//базовая цена в(из) город(а) в byn
select = document.getElementById("cartype");
var car = select.options[select.selectedIndex].value;
var b = [!currency-usd!];//курс usd
var c = [!currency-euro!];//курс euro
var d = [!currency-rub!];//курс рос.руб.
document.getElementById('price').innerHTML = '<span class="main-currency">Стоимость ' + Math.round(a*car) + ' Руб.</span><span class="usd">' + Math.round((a/b)*car)+' USD</span><span class="euro">' + Math.round((a/c)*car) + ' EURO</span><span class="rub">' + Math.round((a*100/d)*car) + ' RUB</span>';
</script>
<div class="text-center col-xs-12">
<div class="caption sfb rev-buttons tp-resizeme">
<button id="order" class="btn btn-theme-bg btn-lg" type="submit" title="Отправить" form="city[*id*]">Заказать трансфер</button></div>
</div>
<script>
document.getElementById('city[*id*]').onsubmit = function(){
var from = "Трансфер Город - [*pagetitle*]";
var cartype_sel = document.getElementById("cartype");
var cartype = cartype_sel.options[cartype_sel.selectedIndex].text;
var booster = document.getElementById('booster').value;
var http = new XMLHttpRequest();
http.open("POST", "./assets/templates/site/mail.php", true);
http.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
http.send("&from="+ from + "&name=" + this.name.value + "&cartype=" + cartype + "&address=" + this.address.value + "&count=" + this.count.value + "&phone=" + this.phone.value + "&date=" + this.date.value + "&email=" + this.email.value + "&booster=" + this.booster.value + "&credit_card=" + this.credit_card.value + "&description=" + this.description.value);
http.onreadystatechange = function() {
if (http.readyState == 4 && http.status == 200) {
alert('Спасибо, мы ответим Вам в ближайшее время');
location.reload();
}
}
http.onerror = function() {
alert('Извините, данные не были переданы');
}
return false;
}
</script>
</form>
Это форма заказа и калькулятор стоимости поездки на такси. При загрузке страницы происходит расчет стоимости поездки с помощью js. По ТЗ возможен выбор класса авто с изменением цены поездки (реализовано с помощью select и onchange=""). Пришлось писать тот же js, но только для выполнения onchange="". Код на 44 и 156 строках дублируется. Так же дублируется обработчик формы поскольку имеем 4 таба для каждого направления: в город, из города, в аэропорт и из аэропорта. Прошу помощи с целью упростить/объединить одинаковые js.
