Jul 8 - Update scheduled inspection 2

app/templates/scheduled_inspections/form.html

@@ -10,9 +10,21 @@
         <form method="POST" novalidate>
           {{ form.hidden_tag() }}
 
+          {# Contract selector — UI only; narrows the facility list via AJAX #}
+          <div class="mb-3">
+            <label class="form-label fw-semibold" for="contract_select">Contract</label>
+            <select id="contract_select" class="form-select">
+              <option value="">— Select Contract —</option>
+              {% for p in projects %}
+              <option value="{{ p.id }}">{{ p.name }}</option>
+              {% endfor %}
+            </select>
+          </div>
+
+          {# Facility — populated by JS once a contract is chosen #}
           <div class="mb-3">
             {{ form.facility_id.label(class="form-label fw-semibold") }}
-            {{ form.facility_id(class="form-select") }}
+            {{ form.facility_id(class="form-select", id="facility_id") }}
             {% for e in form.facility_id.errors %}<div class="text-danger small">{{ e }}</div>{% endfor %}
           </div>
 
@@ -65,3 +77,57 @@
   </div>
 </div>
 {% endblock %}
+
+{% block extra_js %}
+<script>
+(function () {
+  'use strict';
+  var contractSel = document.getElementById('contract_select');
+  var facilitySel = document.getElementById('facility_id');
+  if (!contractSel || !facilitySel) { return; }
+
+  var FACILITIES_URL = '{{ url_for("inspections.facilities_for_project", project_id=0) }}'.replace('/0', '/');
+  var preProjectId  = {{ selected_project_id | tojson }};
+  var preFacilityId = {{ form.facility_id.data | tojson }};
+
+  function setPlaceholder() {
+    facilitySel.innerHTML = '<option value="">— Select a Contract first —</option>';
+    facilitySel.disabled  = true;
+  }
+
+  function loadFacilities(projectId, restoreFacilityId) {
+    facilitySel.disabled  = true;
+    facilitySel.innerHTML = '<option value="">Loading…</option>';
+    fetch(FACILITIES_URL + projectId)
+      .then(function (r) { return r.json(); })
+      .then(function (data) {
+        facilitySel.innerHTML = '<option value="">— Select Facility —</option>';
+        data.forEach(function (f) {
+          var opt = document.createElement('option');
+          opt.value = f.id;
+          opt.textContent = f.name;
+          if (restoreFacilityId && f.id === restoreFacilityId) { opt.selected = true; }
+          facilitySel.appendChild(opt);
+        });
+        facilitySel.disabled = false;
+      })
+      .catch(function () {
+        facilitySel.innerHTML = '<option value="">Could not load facilities</option>';
+      });
+  }
+
+  contractSel.addEventListener('change', function () {
+    if (this.value) { loadFacilities(this.value, null); }
+    else { setPlaceholder(); }
+  });
+
+  // Initial state: restore the contract + facility on edit / validation error.
+  if (preProjectId) {
+    contractSel.value = String(preProjectId);
+    loadFacilities(preProjectId, preFacilityId);
+  } else {
+    setPlaceholder();
+  }
+}());
+</script>
+{% endblock %}