Автоматически Рассчитать функцию jquery/javascript для формы

Question

Так что в основном мне нужно добавить к этой форме - http://jsfiddle.net/tSsvb/ автоматический расчет цены. Например, эти параметры - (3 байка являются только тестом, может быть как 100 или даже 200). Так в основном -

Bike 1 - 
Price for 1 - 2 days in Season 1 - 5$ per day. 
Price for 1 - 2 days in Season 2 - 10$ per day. 
Price for 1 - 2 days in Season 3 - 20$ per day. 
Price for 3 - 7 days in Season 1 - 4$ per day. 
Price for 3 - 7 days in Season 2 - 7$ per day. 
Price for 3 - 7 days in Season 3 - 15$ per day. 
Price for 8+ days in Season 1 - 3$ per day. 
Price for 8+ days in Season 2 - 5$ per day. 
Price for 8+ days in Season 3 - 12$ per day. 

Bike 2 - 
Price for 1 - 2 days in Season 1 - 10$ per day. 
Price for 1 - 2 days in Season 2 - 20$ per day. 
Price for 1 - 2 days in Season 3 - 30$ per day. 
Price for 3 - 7 days in Season 1 - 7$ per day. 
Price for 3 - 7 days in Season 2 - 15$ per day. 
Price for 3 - 7 days in Season 3 - 25$ per day. 
Price for 8+ days in Season 1 - 5$ per day. 
Price for 8+ days in Season 2 - 12$ per day. 
Price for 8+ days in Season 3 - 22$ per day. 

Bike 3 - 
Price for 1 - 2 days in Season 1 - 3$ per day. 
Price for 1 - 2 days in Season 2 - 5$ per day. 
Price for 1 - 2 days in Season 3 - 10$ per day. 
Price for 3 - 7 days in Season 1 - 2$ per day. 
Price for 3 - 7 days in Season 2 - 3$ per day. 
Price for 3 - 7 days in Season 3 - 7$ per day. 
Price for 8+ days in Season 1 - 1$ per day. 
Price for 8+ days in Season 2 - 2$ per day. 
Price for 8+ days in Season 3 - 5$ per day. 

и даты сезона -

Season 1: 1 January to 10 June and 21 September to 31 December 
Season 2: 11 June to 30 June and 1 September to 20 September 
Season 3: 1 July to 31 August 

Так давайте сделаем расчет тест. Если выбрать дату с 1 июля по 25 сентября расчет будет для велосипеда 3 следующим образом -

62 * 5 + 20 * 2 + 5 * 1 = 310 + 40 + 5 = 355 $

И эта сумма должна автоматически добавляться в текстовое поле «Цена». Если я изменю даты, цена также автоматически изменится. Есть ли простой способ создать что-то подобное? Если у вас есть вопросы - спросите, я буду рад ответить на них, так что вы можете помочь мне решить этот вопрос более легко.

Answer 1

Живой пример: http://jsfiddle.net/tSsvb/1/

Я начал с 2-х переменных, которые представляют собой

• массив из различных сезонов
• объект, который представляет собой ценовую матрицу

---

var seasonLookup = [ 
    {startDay: 1, startMonth:1, endDay: 10, endMonth: 6, season:1}, 
    {startDay: 21, startMonth:9, endDay: 31, endMonth: 12, season:1}, 
    {startDay: 11, startMonth:6, endDay: 30, endMonth: 6, season:2}, 
    {startDay: 1, startMonth:9, endDay: 20, endMonth: 9, season:2}, 
    {startDay: 1, startMonth:7, endDay: 31, endMonth: 8, season:3},  
    ]; 

var priceMatrix = { 
    bike3: { 
     1: { t1: 2, t2: 2, t3: 1}, 
     2: { t1: 5, t2: 3, t3: 2}, 
     3: { t1: 10, t2: 3, t3: 5} 
    }   
}; 

---

Первый довольно простой. Во-вторых, я только смутил bike3, поскольку это тот, который вы использовали в вашем примере. 1, 2 & 3 представляют сезон, t1 - t3 представляют ярус-х платежа с t1 HARDCODED в течение 1-2 дней, t2 в 3-7 и t3 в 8+.

Затем я создал 2 функции. Создаётся сезон на указанную дату:

function getSeason(date){ 
    var day = date.getDate(); 
    var month = date.getMonth()+1; 
    var year = date.getFullYear(); 
    for(var i=0;i<seasonLookup.length;i++){ 
     var s = seasonLookup[i]; 
     var startDate = new Date(year, s.startMonth-1,s.startDay); 
     var endDate = new Date(year, s.endMonth-1,s.endDay); 
     if(date >= startDate && date <= endDate) 
      return s.season; 
    } 
    return null; 
} 

Другой получает общую цену на определенный велосипед в указанном сезоне в течение определенного количества дней:

function getPrice(bike, season, days){ 
    var tier = ""; 
    if(days <=2) 
    tier = "t1"; 
    else if(days <=7)  
     tier = "t2"; 
    else 
     tier = "t3" 
    return priceMatrix[bike][season][tier] * days; 
} 

---

Следующий шаг является метод для фактического расчета на основе даты начала, дату окончания и велосипед:

function calculatePrice(startDate, endDate, bike) 
{ 
    var currentSeason = getSeason(startDate); 
    var totalPrice = 0; 
    var daysInSeason = 0; 
    var currentDate = startDate; 
    while(currentDate<=endDate){ 
     var season = getSeason(currentDate); 
     if(season != currentSeason){ 
       totalPrice += getPrice(bike,currentSeason,daysInSeason); 
       currentSeason = season; 
       daysInSeason = 0; 
     } 
     daysInSeason++; 
     currentDate.setDate(currentDate.getDate()+1);   
    } 
    totalPrice += getPrice(bike,currentSeason,daysInSeason); 
    return totalPrice; 
} 

и в заключительной части является ого-го k, чтобы он пересчитывал любое изменение выпадающих списков. jQuery - ваш друг здесь.Я hadded класса recalc ко всем элементам, которые должны привести к перерасчету, идентификаторы на все, чтобы сделать их легче ссылаться, и подключил в change события для создания параметров и вызывать метод:

$('.recalc').change(function(){ 
    var startDate = new Date(parseInt($('#yd').val(),10),parseInt($('#md').val(),10)-1,parseInt($('#dd').val(),10)); 
    var endDate = new Date(parseInt($('#yr').val(),10),parseInt($('#mr').val(),10)-1,parseInt($('#dr').val(),10)); 
    var bike = $('#bike').val(); 

    var price = calculatePrice(startDate,endDate,bike); 
    $('#price').val(price); 

}); 

Надежда, что помогает, вам может понадобиться генерировать ваши ценовые матрицы с PHP, но для вас это упражнение :)