Update templates/index.html

templates/index.html

@@ -323,7 +323,6 @@
             opacity: 1;
         }
         
-        /* Ensure summary labels are clean */
         .summary-label {
             font-weight: 600;
             color: var(--primary-color);
@@ -646,7 +645,7 @@
                 e.preventDefault();
                 
                 if (validateStep(currentStep)) {
-                    // Show loading overlay
+                    console.log("Form validated, initiating prediction request");
                     $('#loading-overlay').fadeIn();
                     
                     // Collect form data
@@ -662,6 +661,7 @@
                         bmi: $('#bmi').val(),
                         smoking_status: $('#smoking_status').val()
                     };
+                    console.log("Form data collected:", formData);
                     
                     // Send data to Flask backend
                     $.ajax({
@@ -669,12 +669,15 @@
                         type: 'POST',
                         contentType: 'application/json',
                         data: JSON.stringify({ input: formData }),
+                        beforeSend: function() {
+                            console.log("Sending AJAX request to /predict");
+                        },
                         success: function(response) {
+                            console.log("Received response:", response);
+                            $('#loading-overlay').fadeOut();
+                            
                             if (response.success) {
-                                // Hide loading overlay
-                                $('#loading-overlay').fadeOut();
-                                
-                                // Process and display result
+                                console.log("Prediction successful, rendering result");
                                 $('#prediction-result').text(response.prediction);
                                 $('#result').removeClass('high-risk low-risk');
                                 if (response.prediction === 'Stroke Risk') {
@@ -685,16 +688,25 @@
                                 $('#result').show().removeClass('animate__fadeOut').addClass('animate__fadeIn');
                                 $('#prediction-form').hide();
                             } else {
-                                $('#loading-overlay').fadeOut();
+                                console.error("Prediction failed:", response.error);
                                 alert('Error: ' + response.error);
+                                $('#result').hide();
                             }
                         },
                         error: function(xhr, status, error) {
-                            console.error('Error submitting data:', error);
+                            console.error("AJAX request failed:", { status: status, error: error, response: xhr.responseText });
                             $('#loading-overlay').fadeOut();
-                            alert('An error occurred while processing your request. Please try again.');
+                            $('#prediction-result').text("Error occurred while processing your request.");
+                            $('#result').removeClass('high-risk low-risk').addClass('high-risk');
+                            $('#result').show().removeClass('animate__fadeOut').addClass('animate__fadeIn');
+                            $('#prediction-form').hide();
+                        },
+                        complete: function() {
+                            console.log("AJAX request completed");
                         }
                     });
+                } else {
+                    console.log("Form validation failed");
                 }
             });
         });