Judy Posts - Answer Overflow

Judy

•Created by Judy on 6/5/2024 in #front-end

React useEffect problem

~ useEffect(() => { const fetchPins = async () => { setLoading(true); setError(null); try { let query; if (text === "created") { console.log("Running userCreatedPinsQuery"); query = userCreatedPinsQuery(userId); } else { console.log("Running userSavedPinsQuery"); query = userSavedPinsQuery(userId); } console.log("Generated query:", query); const data = await client.fetch(query); console.log("Fetched data:", data); setPins(data); } catch (err) { console.error("Error fetching pins:", err); setError(err); } finally { setLoading(false); } }; fetchPins(); console.log(Fetching pins for text: ${text} and userId: ${userId}); }, [text, userId]); ~ i am working with sanity and i want to change the pins displayed when the text changes. problem is the text does change from created to save and runs the code as expected but when i change it back to created, it still runs the code with savedQuery not the createdQuery

16 replies

KPCKevin Powell - Community

•Created by Judy on 10/25/2023 in #os-and-tools

VS CODE NOT RESPONDING ERROR

Lately, I have been noticing my vscode is slow to save files when I hit Ctrl + s and after a while, I get a vs code not responding error. Please how can I fix this?

3 replies

KPCKevin Powell - Community

•Created by Judy on 10/25/2023 in #front-end

VS CODE ISSUES WITH FORMAT ON SAVE

6 replies

KPCKevin Powell - Community

•Created by Judy on 9/19/2023 in #front-end

Stop form from sending when validation fails.

I have an internal validation for the input field on my form and I don't wanţthe form to submit when the user has an invalid email address based on my requirements. I have tried e.preventDefault() and return false; but it is still not working😭😭. I need help it is super urgent. This is what my input validation looks like

const valid = () => {
  const email = document.getElementById("email");
  const err = document.getElementById("err");

  email.addEventListener("input", (e) => {
    const validEmail = e.target.value;
    const pattern = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/;
    const approved = validEmail.match(pattern);

    if (approved) {
      err.classList.remove("active");
    } else {
      err.classList.add("active");
    }

    if (email.value === "") {
      err.classList.remove("active");
    }
  });
};
valid();

const valid = () => {
  const email = document.getElementById("email");
  const err = document.getElementById("err");

  email.addEventListener("input", (e) => {
    const validEmail = e.target.value;
    const pattern = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/;
    const approved = validEmail.match(pattern);

    if (approved) {
      err.classList.remove("active");
    } else {
      err.classList.add("active");
    }

    if (email.value === "") {
      err.classList.remove("active");
    }
  });
};
valid();

this is what my submit to google sheet api looks like.

const scriptURL =
  "https://script.google.com/macros/s/AKfycbx3oxaIEyUfmz9W5fyEdZifo_jyfYLKVclnRVx1rys1md3bJPi5_IQpOrlsLppDzKhA/exec";
const form = document.forms["submit-to-google-sheet"];
const msgSent = document.getElementById("msg-sent");
const msgErr = document.getElementById("msg-err");
form.addEventListener("submit", (e) => {
  e.preventDefault();
  fetch(scriptURL, { method: "POST", body: new FormData(form) })
    .then((response) => {
      msgSent.innerHTML = "Message Sent Successfully.✅";

      setTimeout(function () {
        msgSent.innerHTML = "";
      }, 3000);
      form.reset();
    })
    .catch((error) => {
      msgErr.innerHTML = "Oops! Something Went Wrong.❌";

      setTimeout(function () {
        msgErr.innerHTML = "";
      }, 3000);
    });
});

const scriptURL =
  "https://script.google.com/macros/s/AKfycbx3oxaIEyUfmz9W5fyEdZifo_jyfYLKVclnRVx1rys1md3bJPi5_IQpOrlsLppDzKhA/exec";
const form = document.forms["submit-to-google-sheet"];
const msgSent = document.getElementById("msg-sent");
const msgErr = document.getElementById("msg-err");
form.addEventListener("submit", (e) => {
  e.preventDefault();
  fetch(scriptURL, { method: "POST", body: new FormData(form) })
    .then((response) => {
      msgSent.innerHTML = "Message Sent Successfully.✅";

      setTimeout(function () {
        msgSent.innerHTML = "";
      }, 3000);
      form.reset();
    })
    .catch((error) => {
      msgErr.innerHTML = "Oops! Something Went Wrong.❌";

      setTimeout(function () {
        msgErr.innerHTML = "";
      }, 3000);
    });
});

PLEASE what am i doing wrong?

5 replies

KPCKevin Powell - Community

•Created by Judy on 9/12/2023 in #front-end

Last pass password manager bug...

Hello everyone... I am currently working on a project and Last pass Password manager is adding elements to my html contact form. Has anyone faced this issue? If yes please how did you fix it? This is the element it keeps adding. When I open my dev tools and remove it, It goes away but comes back after refresh .... <div data-lastpass-icon-root="true" style="position: relative !important; height: 0px !important; width: 0px !important; float: left !important;"></div> ....

29 replies

Gaming

Programming