Dynamically calculing the if function
<p>I have some calculations in <code>compute</code> function.</p>

<pre><code>function compute() {
  var c = $('select#time_from_hour').val();
  var d = $('select#time_from_minute').val();
  var e = $('select#time_to_hour').val();
  var f = $('select#time_to_minute').val();
  var g = $('input#date_from').val();
  var h = $('input#date_to').val();
  var hour1 = g + ' ' + c + ':' + d;
  var hour2 = h + ' ' + e + ':' + f;

  hour1 = hour1.split("/");
  var hour1 = hour1[1] + "," + hour1[0] + "," + hour1[2];
  var timestamp = (new Date(hour1).getTime() / 1000) + 7200;
  $('#total_hour1').val(timestamp);

  hour2 = hour2.split("/");
  var hour2 = hour2[1] + "," + hour2[0] + "," + hour2[2];
  var timestamp = (new Date(hour2).getTime() / 1000) + 7200;
  $('#total_hour2').val(timestamp);

  var x = -$('input#total_hour1').val();
  var y = -$('input#total_hour2').val();
  var total_time = x - y;
  result = total_time / 86400;
  new_number = Math.ceil(result);

  if (isNaN(new_number)) {
    var new_number = 0;
  }
  $('#finish_day').val(new_number);

  if (parseInt($("#finish_day").val()) &lt; 4) {
    $('#get_car, #return_car').not(this).children('#return_car option[value=' + this.value + ']').attr('selected', true).siblings().attr('disabled', true);
    $('#three_day').show(2000);
  } else {
    $('#get_car &gt; option, #return_car &gt; option').prop('disabled', false);
    $('#three_day').hide(2000, function() {
      $(this).remove();
    });
  }
}

$('select#time_from_hour').change(compute);
$('select#time_from_minute').change(compute);
$('select#time_to_hour').change(compute);
$('select#time_to_minute').change(compute);
$('select#return_car').change(compute);
$('select#get_car').change(compute);
$('input#finish_day').change(compute);
</code></pre>

<p>I try to force a script to dynamically recalculate the <code>if</code> function when the data in the input field <code>#finish_day</code> is changed. </p>

<pre><code>if (parseInt($("#finish_day").val()) &lt; 4) {
  $('#get_car, #return_car').not(this).children('#return_car option[value=' + this.value + ']').attr('selected', true).siblings().attr('disabled', true);
  $('#three_day').show(2000);
} else {
  $('#get_car &gt; option, #return_car &gt; option').prop('disabled', false);
  $('#three_day').hide(2000, function() {
    $(this).remove();
  });
}
</code></pre>

<p>It changed only when I change the data in <code>#get_car</code></p>

<p>Working example: <a href="http://jsfiddle.net/amarcinkowski/W7NHK/25/" rel="nofollow">http://jsfiddle.net/amarcinkowski/W7NHK/25/</a></p>

<hr>

<p>The problem is as follows:</p>

<p>I have a reservation form, where I use the datepicker, where I have two dates boxes: the start and the end, and two select  form fields with a list of available cities. Depending on the selected dates the script calculate the number of days.</p>

<p>If the number of days is less than 4, on one of the select lists of cities (the second - City2) changes the availability of active cites and automatically selects the city selected in the first list (City1). So if we select on the first list city – Katowice for example,  and the number of days is less than 4 on the second list script automatically marked the Katowice city and the others cities will be inactive (disabled).</p>

<p>The problem begins when the number of days is greater than 4 days. Both lists are fully active and you can choose any city, without restrictions. If you select different cities and then change the date, and number of days go down to 3 (for example) the whole script should recalculate values and set in the second window, the city which  was chosen in first window (City1 = City2). Unfortunately, this does not happen.  Additionally, in the second list, you can choose any city – all are active. The whole script is recalculating only if you select the city from the first list.</p>
