shipping address validations issues fixed

controllers/productsController.js

@@ -99,6 +99,11 @@ const addProduct = async (req, res) => {
       files.image4[0].filename,
     ];
 
+    for (let i = 0; i < img.length; i++) {
+      await sharp("public/products/images/" + img[i])
+        .resize(480, 480)
+        .toFile("public/products/crop/" + img[i]);
+    }
     for (let i = 0; i < img.length; i++) {
       await sharp("public/products/images/" + img[i])
         .resize(480, 480)

public/user/css/style.css

@@ -16575,7 +16575,7 @@ button:focus {
 .nav-dashboard .nav-link.active {
     color: #000;
     font-weight: 500;
-    
+
 }
 
 .nav-dashboard .nav-link.active {
@@ -20155,36 +20155,52 @@ button:focus {
     height: 280px;
     width: 450px;
     border-radius: 3rem;
-    background: rgb(0,0,0);
+    background: rgb(0, 0, 0);
     background: radial-gradient(circle at 10% 20%, rgb(87, 108, 117) 0%, rgb(37, 50, 55) 100.2%);
 }
 
 .my-custom-scrollbar {
     position: relative;
     height: 200px;
     overflow: auto;
-    }
-    .table-wrapper-scroll-y {
+}
+
+.table-wrapper-scroll-y {
     display: block;
-    }
+}
 
 
-    /* profile page related css  */
-.profile-nav-tabs{
- background: #F3F3F9;
- color: #000;
- border-radius: 7px;
- padding-left: 2rem;
- margin-bottom: 5px;
- border: 0.1px solid #c0bfbf;
+/* profile page related css  */
+.profile-nav-tabs {
+    background: #F3F3F9;
+    color: #000;
+    border-radius: 7px;
+    padding-left: 2rem;
+    margin-bottom: 5px;
+    border: 0.1px solid #c0bfbf;
 }
 
-.profile-inputs{
+.profile-inputs {
     color: #000;
-    border: 0.1px solid #c0bfbf; 
+    border: 0.1px solid #c0bfbf;
     border-radius: 7px;
     background: #F3F3F9;
 }
 
+.filtterClear {
+    width: 9rem;
+    border-radius: 7px;
+    border: 0.1px solid #747373;
+    background-color: #fff;
+    font-size: 12px;
+    transition: all 0.5s ease;
 
-
+}
+.filtterClear:hover {
+    background: #000;
+    transition: ease-in-out;
+    color:#fff;
+    width: 9.1rem;
+    font-weight:  600;
+    transition: all 0.5s ease;
+}

public/user/js/formValidations.js

@@ -0,0 +1,132 @@
+function showFormValidAlert() {
+    console.log("alert fun called...");
+    $("#FormAlert").fadeIn();
+
+    setTimeout(function () {
+      $("#FormAlert").fadeOut();
+    }, 5000);
+  }
+
+
+  function userProfieValidation() {
+    var userName = document.getElementsByName("userName")[0].value;
+    var fullName = document.getElementsByName("fullName")[0].value;
+    var email = document.getElementsByName("email")[0].value;
+    var pincode = document.getElementsByName("pincode")[0].value;
+    var ValidErrMess = document.getElementById("ValidErrMess");
+
+    if (!userName.trim() || !fullName.trim() || !email.trim()) {
+        // alert("All fields marked with '*' must be filled out.");
+        ValidErrMess.innerHTML = "All fields marked with '*' must be filled out.";
+        showFormValidAlert()
+        return false;
+    }
+
+    if (!validateEmail(email)) {
+        // alert("Invalid email address.");
+        ValidErrMess.innerHTML = "Invalid email address.";
+        showFormValidAlert()
+        return false;
+    }
+
+    if (pincode.trim() && !validatePincode(pincode)) {
+        // alert("Invalid pin code. It should be a valid number.");
+        ValidErrMess.innerHTML = "Invalid pin code. It should be a valid number.";
+        showFormValidAlert()
+        return false;
+    }
+
+    return true;
+}
+
+function validateEmail(email) {
+    var emailRegex = /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,4}$/;
+    return emailRegex.test(email);
+}
+
+function validatePincode(pincode) {
+    return !isNaN(pincode);
+}
+
+
+
+
+function validateUserAddressForm() {
+    var country = document.getElementById("Countryadd").value;
+    var fullName = document.getElementById("fullNameadd").value;
+    var mobileNumber = document.getElementById("mobileNumberadd").value;
+    var city = document.getElementById("cityadd").value;
+    var state = document.getElementById("stateadd").value;
+    var pincode = document.getElementById("pincodeadd").value;
+    var ValidErrMess = document.getElementById("ValidErrMess");
+
+
+    if (!country.trim() || !fullName.trim() || !mobileNumber.trim() || !city.trim() || !state.trim() || !pincode.trim()) {
+        // alert("All fields marked as required must be filled out.");
+        ValidErrMess.innerHTML = "All fields are Required must be filled out"
+        showFormValidAlert()
+        return false;
+    }
+
+    if (!validateMobileNumber(mobileNumber)) {
+        // alert("Invalid mobile number. It should be a valid number between 10 and 12 digits.");
+        ValidErrMess.innerHTML = "Invalid mobile number. It should be a valid number between 10 and 12 digits."
+        showFormValidAlert()
+        return false;
+    }
+
+    if (!validatePincode(pincode)) {
+        // alert("Invalid pin code. It should be a valid 6-digit number.");
+        ValidErrMess.innerHTML = "Invalid pin code. It should be a valid 6-digit number."
+        showFormValidAlert()
+        return false;
+    }
+
+    return true;
+}
+
+function validateMobileNumber(mobileNumber) {
+    mobileNumber = mobileNumber.replace(/\D/g, "");
+    return mobileNumber.length >= 10 && mobileNumber.length <= 12;
+}
+
+function validatePincode(pincode) {
+    return /^\d{6}$/.test(pincode);
+    // return !isNaN(pincode);
+}
+
+
+
+function validateUserAddressFormUpdate() {
+    var country = document.getElementById("Countryedit").value;
+    var fullName = document.getElementById("fullNameedit").value;
+    var mobileNumber = document.getElementById("mobileNumberedit").value;
+    var city = document.getElementById("cityedit").value;
+    var state = document.getElementById("stateedit").value;
+    var pincode = document.getElementById("pincodeedit").value;
+    var ValidErrMess = document.getElementById("ValidErrMess");
+
+
+    if (!country.trim() || !fullName.trim() || !mobileNumber.trim() || !city.trim() || !state.trim() || !pincode.trim()) {
+        // alert("All fields marked as required must be filled out.");
+        ValidErrMess.innerHTML = "All fields are Required must be filled out"
+        showFormValidAlert()
+        return false;
+    }
+
+    if (!validateMobileNumber(mobileNumber)) {
+        // alert("Invalid mobile number. It should be a valid number between 10 and 12 digits.");
+        ValidErrMess.innerHTML = "Invalid mobile number. It should be a valid number between 10 and 12 digits."
+        showFormValidAlert()
+        return false;
+    }
+
+    if (!validatePincode(pincode)) {
+        // alert("Invalid pin code. It should be a valid 6-digit number.");
+        ValidErrMess.innerHTML = "Invalid pin code. It should be a valid 6-digit number."
+        showFormValidAlert()
+        return false;
+    }
+
+    return true;
+}

views/user/address.ejs

@@ -69,52 +69,52 @@
                                         <button type="button" class=" btn-dark " data-bs-dismiss="modal"
                                             aria-label="Close">x</button>
                                     </div>
-                                    <form action="/profile/user_address/edit" method="post">
+                                    <form action="/profile/user_address/edit" method="post" onsubmit="return validateUserAddressFormUpdate()">
                                         <div class="modal-body p-4">
                                             <div class="mb-1">
-                                                <label for="exampleFormControlInput1"
+                                                <label for="Countryedit"
                                                     class="form-label m-0">Country/Region
                                                 </label>
                                                 <input type="text" class="form-control address-input"
-                                                    id="exampleFormControlInput1" name="country" value="<%=address[i].country%>" required>
+                                                    id="Countryedit" name="country" value="<%=address[i].country%>" >
                                             </div>
                                             <div class="mb-1">
-                                                <label for="exampleFormControlInput1" class="form-label m-0">Full name
+                                                <label for="fullNameedit" class="form-label m-0">Full name
                                                     (First and Last
                                                     name)
                                                 </label>
                                                 <input type="text" class="form-control address-input"
-                                                    id="exampleFormControlInput1" value="<%=address[i].fullName%>" name="fullName"  required>
+                                                    id="fullNameedit" value="<%=address[i].fullName%>" name="fullName"  >
                                             </div>
                                             <div class="mb-1">
-                                                <label for="exampleFormControlInput1" class="form-label m-0">Mobile
+                                                <label for="mobileNumberedit" class="form-label m-0">Mobile
                                                     number
                                                 </label>
                                                 <input type="number" class="form-control address-input"
-                                                    id="exampleFormControlInput1" value="<%=address[i].mobileNumber%>" pattern="[0-9]{10,12}" maxlength="12" name="mobileNumber" required>
+                                                    id="mobileNumberedit" value="<%=address[i].mobileNumber%>"  name="mobileNumber" >
                                             </div>
                                             
                                             <div class="mb-1">
-                                                <label for="exampleFormControlInput1" class="form-label m-0">Area,
+                                                <label for="cityedit" class="form-label m-0">Area,
                                                     Street, Sector,
                                                     Village
                                                 </label>
                                                 <input type="text" class="form-control address-input"
-                                                    id="exampleFormControlInput1" value="<%=address[i].city%>" name="city" required>
+                                                    id="cityedit" value="<%=address[i].city%>" name="city" >
                                             </div>
 
                                             <div class=" row ">
                                                 <div class=" col-6">
-                                                    <label for="exampleFormControlInput1" class="form-label m-0">State
+                                                    <label for="stateedit" class="form-label m-0">State
                                                     </label>
                                                     <input type="text" class="form-control address-input"
-                                                        id="exampleFormControlInput1" name="state" value="<%=address[i].state%>" required>
+                                                        id="stateedit" name="state" value="<%=address[i].state%>" >
                                                 </div>
                                                 <div class=" col-6">
-                                                    <label for="exampleFormControlInput1" class="form-label m-0">Pincode
+                                                    <label for="pincodeedit" class="form-label m-0">Pincode
                                                     </label>
                                                     <input type="number" value="<%=address[i].pincode%>" class="form-control address-input"
-                                                        id="exampleFormControlInput1" name="pincode" required>
+                                                        id="pincodeedit" name="pincode" >
                                                 </div>
                                                 <input value="<%=address[i]._id%>" class="form-control address-input"
                                                         id="exampleFormControlInput1" name="adressId" hidden required>
@@ -197,72 +197,46 @@
                         <h5 class="" id="exampleModalLabel">Add New Address</h5>
                         <button type="button" class=" btn-dark " data-bs-dismiss="modal" aria-label="Close">x</button>
                     </div>
-                    <form action="/profile/user_address" method="post">
+                    <form action="/profile/user_address" method="post" onsubmit="return validateUserAddressForm()">
                         <div class="modal-body p-4">
                             <div class="mb-1">
-                                <label for="exampleFormControlInput1" class="form-label m-0">Country/Region
-                                </label>
-                                <input type="text" class="form-control address-input" id="exampleFormControlInput1"
-                                    name="country" required>
+                                <label for="Countryadd" class="form-label m-0">Country/Region</label>
+                                <input type="text" class="form-control address-input" id="Countryadd" name="country">
                             </div>
                             <div class="mb-1">
-                                <label for="exampleFormControlInput1" class="form-label m-0">Full name (First and Last
-                                    name)
-                                </label>
-                                <input type="text" class="form-control address-input" id="exampleFormControlInput1"
-                                    name="fullName" required>
+                                <label for="fullNameadd" class="form-label m-0">Full name (First and Last name)</label>
+                                <input type="text" class="form-control address-input" id="fullNameadd" name="fullName">
                             </div>
-                            <!-- <div class="mb-1">
-                                <label for="exampleFormControlInput1" class="form-label m-0">Mobile number
-                                </label>
-                                <input type="number" class="form-control address-input" id="exampleFormControlInput1"
-                                    name="mobileNumber" required>
-                            </div> -->
-
                             <div class="mb-1">
-                                <label for="mobileNumberInput" class="form-label m-0">Mobile number</label>
-                                <input type="number" class="form-control address-input" id="mobileNumberInput" name="mobileNumber" required>
+                                <label for="mobileNumberadd" class="form-label m-0">Mobile number</label>
+                                <input type="number" class="form-control address-input" id="mobileNumberadd" name="mobileNumber">
                             </div>
-
-
-
                             <div class="mb-1">
-                                <label for="exampleFormControlInput1" class="form-label m-0">Area, Street, Sector,
-                                    Village
-                                </label>
-                                <input type="text" class="form-control address-input" id="exampleFormControlInput1"
-                                    name="city" required>
+                                <label for="cityadd" class="form-label m-0">Area, Street, Sector, Village</label>
+                                <input type="text" class="form-control address-input" id="cityadd" name="city">
                             </div>
-
                             <div class=" row ">
                                 <div class=" col-6">
-                                    <label for="exampleFormControlInput1" class="form-label m-0">State
-                                    </label>
-                                    <input type="text" class="form-control address-input" id="exampleFormControlInput1"
-                                        name="state" required>
+                                    <label for="stateadd" class="form-label m-0">State</label>
+                                    <input type="text" class="form-control address-input" id="stateadd" name="state">
                                 </div>
                                 <div class=" col-6">
-                                    <label for="exampleFormControlInput1" class="form-label m-0">Pincode
-                                    </label>
-                                    <input type="number" class="form-control address-input"
-                                        id="exampleFormControlInput1" name="pincode" required>
+                                    <label for="pincodeadd" class="form-label m-0">Pincode</label>
+                                    <input type="number" class="form-control address-input" id="pincodeadd" name="pincode">
                                 </div>
                             </div>
-
                         </div>
                         <div class="modal-footer">
-                            <a class="btn btn-outline-primary-2" style="border-radius: 7px;"
-                                data-bs-dismiss="modal">Close</a>
-                            <button type="submit" class="btn btn-outline-primary-2"
-                                style="border-radius: 7px; background: #000; color: #fff;">Add
-                                now</button>
+                            <a class="btn btn-outline-primary-2" style="border-radius: 7px;" data-bs-dismiss="modal">Close</a>
+                            <button type="submit" class="btn btn-outline-primary-2" style="border-radius: 7px; background: #000; color: #fff;">Add now</button>
                         </div>
                     </form>
+
                 </div>
             </div>
         </div>
         <!-- model end -->
-        <script>
+        <!-- <script>
             document.addEventListener('DOMContentLoaded', function () {
                 var mobileNumberInput = document.getElementById("mobileNumberInput");
         
@@ -280,7 +254,7 @@
                     }
                 });
             });
-        </script>
+        </script> -->