javascript - オプション選択時にテキストフィールドを有効にする

Question

次のコードを使用すると、次のことができます。
1. 出発地の都市を選択します。都市を選択すると、次のコントロールが有効になります。
2. 行きたい都市を選択します。都市を選択すると、次のコントロールが有効になり
ます。 3. 出発する日付を選択します。

このコードはうまく機能しますが、travel_from リストで選択した都市の直後にある都市を travel_to リストで選択する場合を除きます。理由がわかりません。つまり、 travel_from -controllerで「ナポリ」を選択し、 travel_to-controllerで「パレルモ」を選択した場合、travel_from_dateは有効になりません。

	 //Holds the names of all the cities
	var allCities = ["Naples", "Palermo", "Cagliari", "Barcelona", "Malaga", "Rio de Janeiro"];
	$(document).ready(function() {
	  $("#travel_from, #travel_to").selectmenu();
	  //Disables the travel_from_date-input field 		
	  $("#travel_from_date").prop("disabled", true);
	  $("#travel_to").selectmenu("disable");

	  $("#travel_from").on("selectmenuchange", function(event, ui) {
	    var cities = allCities.slice();
	    var selectedCity = $(this).val();
	    var index = cities.indexOf(selectedCity);
	    for (i = index; i > -1; i--) {
	      cities.splice(i, 1);
	    }
	    $("#travel_to").selectmenu('destroy');
	    $("#travel_to").selectmenu();
	    $("#travel_to option").remove();
	    $("#travel_to").append($('<option selected disabled></option').html("Where to?"));
	    $.each(cities, function(val, text) {
	      $("#travel_to").append(
	        $('<option></option>').val(text).html(text)
	      );
	    });
	    $("#travel_to option:selected").removeAttr("selected");
	    $("#travel_to").selectmenu("enable");
	  });

	  $("#travel_to").on("selectmenuchange", function(event, ui) {
	    $("#travel_from_date").prop("disabled", false);
	  });
	});

<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/hot-sneaks/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<form class="orderform">
  <fieldset>
    <h1>Book your voayage</h1>
    <select id="travel_from">
      <option disabled selected hidden>Where from?</option>
      <option>Naples</option>
      <option>Palermo</option>
      <option>Cagliari</option>
      <option>Barcelona</option>
      <option>Malaga</option>
      <option disabled>Rio de Janeiro</option>
    </select>

    <select id="travel_to">
      <option disabled selected hidden>Where to?</option>
    </select>

    <hr>

    <input id="travel_from_date" title="When do you want to leave?" type="text" name="travel_from_date" placeholder="Outbound" />
  </fieldset>
</form>