Initial commit

static/js/state.js

@@ -0,0 +1,61 @@
+ window.onload = function () {
+        document.getElementById('state_Name').focus();
+    };
+
+
+$(document).ready(function () {
+        $("#state_Name").on("input", function () {
+            let stateName = $(this).val();
+            // Remove numbers and special characters automatically
+            let cleanedName = stateName.replace(/[^A-Za-z ]/g, "");
+            $(this).val(cleanedName);
+        });
+
+        $("#state_Name").on("input", function () {
+            let stateName = $("#state_Name").val().trim();
+
+            if (stateName === "") {
+                $("#stateMessage").text("").css("color", "");
+                $("#submitButton").prop("disabled", true);
+                return;
+            }
+
+            $.ajax({
+                url: "/check_state",
+                type: "POST",
+                contentType: "application/json",
+                data: JSON.stringify({ state_Name: stateName }),
+                success: function (response) {
+                    if (response.status === "available") {
+                        $("#stateMessage").text(response.message).css("color", "green");
+                        $("#submitButton").prop("disabled", false);
+                    }
+                },
+                error: function (xhr) {
+                    if (xhr.status === 409) {
+                        $("#stateMessage").text("State already exists!").css("color", "red");
+                        $("#submitButton").prop("disabled", true);
+                    } else if (xhr.status === 400) {
+                        $("#stateMessage").text("Invalid state name! Only letters are allowed.").css("color", "red");
+                        $("#submitButton").prop("disabled", true);
+                    }
+                }
+            });
+        });
+
+        $("#stateForm").on("submit", function (event) {
+            event.preventDefault();
+            $.ajax({
+                url: "/add_state",
+                type: "POST",
+                data: $(this).serialize(),
+                success: function (response) {
+                    alert(response.message);
+                    location.reload();
+                },
+                error: function (xhr) {
+                    alert(xhr.responseJSON.message);
+                }
+            });
+        });
+});