• Resolved anirbansarkar1

    (@anirbansarkar1)


    I am using the Give Wp plugin for donations on the website. I have created a form to add two email IDs now I am trying to validate two email IDs one for a confirmation email. When I use javascript code for validation it’s not triggering anything i removed my custom. When I checked on the console it’s showing an error from the donation form.

    I need help resolving this console error so that I can add my custom js

    Here is the error code: I think some issue with the donation iframe.

    caught ReferenceError: jqueryParams is not defined
    at donations-2-3-2-3-2-2-2?giveDonationFormInIframe=1:23:1

    My custom js:

    document.addEventListener("DOMContentLoaded", function () {
    
    ?
    ? var emailInput = document.querySelector("#give-email");
    
    ? var confirmEmailInput = document.querySelector("#give-donor_email-253169-2");
    
    ? if (confirmEmailInput) {
    
    ? ? emailInput.addEventListener("input", function () {
    
    ? ? ? if (confirmEmailInput.value !== emailInput.value) {
    
    ? ? ? ? document.getElementById("give-email").style.borderColor = "red";
    
    ? ? ? ? emailInput.setCustomValidity("Email Not matched");
    
    ? ? ? } else {
    
    ? ? ? ? document.getElementById("give-email").style.borderColor = "green";
    
    ? ? ? ? emailInput.setCustomValidity("");
    
    ? ? ? }
    
    ? ? });
    
    ? ? confirmEmailInput.addEventListener("input", function () {
    
    ? ? ? if (confirmEmailInput.value !== emailInput.value) {
    
    ? ? ? ? document.getElementById("give-email").style.borderColor = "red";
    
    ? ? ? ? emailInput.setCustomValidity("Email Not matched");
    
    ? ? ? ? // emailInput.setCustomValidity("");
    
    ? ? ? } else {
    
    ? ? ? ? document.getElementById("give-email").style.borderColor = "green";
    
    ? ? ? ? //document.getElementById("give-first").style.borderColor = "green";
    
    ? ? ? ? emailInput.setCustomValidity("");
    
    ? ? ? }
    
    ? ? });
    
    ? ? var form = document.querySelector(".give-form-253169");
    
    ? ? var donateButton = document.querySelector("#give-purchase-button");
    
    ? ? donateButton.addEventListener("click", function (event) {
    
    ? ? ? event.preventDefault();
    
    ? ? ? validateForm();
    
    ? ? });
    
    ? ? function validateForm() {
    
    ? ? ? var firstNameInput = document.querySelector("#give-first");
    
    ? ? ? var lastNameInput = document.querySelector("#give-last");
    
    ? ? ? var emailInput = document.querySelector("#give-email");
    
    ? ? ? var confirmEmailInput = document.querySelector("#give-first");
    
    ? ? ? if (emailInput.value !== confirmEmailInput.value) {
    
    ? ? ? ? //confirmEmailInput.setCustomValidity("Email addresses must matcSDasdadsh.");
    
    ? ? ? ? alert("Email not matched");
    
    ? ? ? ? document.getElementById("give-email").style.borderColor = "red";
    
    ? ? ? ? return false;
    
    ? ? ? } else {
    
    ? ? ? ? // confirmEmailInput.setCustomValidity("");
    
    ? ? ? ? document.getElementById("give-email").style.borderColor = "green";
    
    ? ? ? }
    
    ? ? ? // If all validations pass, submit the form
    
    ? ? ? document.querySelector(".give-form-253169").submit();
    
    ? ? }
    
    ? }
    
    });
Viewing 1 replies (of 1 total)
  • Hi @anirbansarkar1,
    Glad you reached out. Do you happen to be using Divi? We see jquery params error there sometimes, so just be on the safe side I’ll give you some steps to help with that:

    Divi’s “Defer jQuery And jQuery Migrate” and “Smooth Scrolling” options can break the Multi-Step and Classic Form templates and throw the “jqueryParams is not defined” error.

    Let’s start by disabling those options and see if that helps clear things up. In case you find it helpful, my colleague created a fantastic screencast for how to do that: https://somup.com/c3jw0zUopx.

    If you are not using Divi, I’ll need a little more context. First, send along your system information. You can do this by navigating to Donations > Tools > System Info (tab) and clicking the button to “Get System Report” and copy/paste that into your reply here.

    I’ll also need to know a little more about the custom JS you are using. We don’t usually recommend customizing the JS, so if you could give me a very clear picture of what you are looking to do, it might help give me a little more context to give you best answer.

    Keep me posted if you have questions along the way, I’m happy to help.

Viewing 1 replies (of 1 total)
  • The topic ‘On console showing Javascript error’ is closed to new replies.