Я не получаю информацию о вводе формы в свой почтовый ящик при использовании Emailjs

Question

Я недавно начал использовать электронную почту js, чтобы получать информацию для ввода формы на свой адрес электронной почты. Кажется, все настроено нормально, но не может (после ЧАСОВ исследования), кажется, понять, почему я не получаю никакой входной информации. Любая помощь будет принята с благодарностью!

HTML КОД

    <!--SCRIPT FOR EMAILjs-->

    <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/emailjs-com@2.3.2/dist/email.min.js"></script>
    <script type="text/javascript">
        (function () {
            emailjs.init("user_xxxxxxxxxxxxxxxxxxxxx");
        })();
    </script>


    <!--LOCATION FORM-->

    <form class="contact_form" onsubmit="return sendMail(this);">
        <input type="text" name="full_name" class="form_inputs fullName_input" autocomplete="off" placeholder="Full Name"
            onfocus="this.placeholder = ''" onblur="this.placeholder = 'Full Name'">

        <input type="text" name="emailAddress" class="form_inputs emailAddress_input" autocomplete="off"
            placeholder="Email Address" onfocus="this.placeholder = ''" onblur="this.placeholder = 'Email Address'">

        <p class="cleaningLocationTitle">Cleaning Location:</p>

        <input type="text" name="streetAddress" class="form_inputs streetAddress_input" autocomplete="off"
            placeholder="Street Address" onfocus="this.placeholder = ''" onblur="this.placeholder = 'Street Address'"
            required>

        <input type="text" name="townCity" class="form_inputs townCity_input" autocomplete="off" placeholder="Town/City"
            onfocus="this.placeholder = ''" onblur="this.placeholder = 'Town/City'" required>

        <input type="text" name="postcode" class="form_inputs postcode_input" autocomplete="off" placeholder="Postcode"
            onfocus="this.placeholder = ''" onblur="this.placeholder = 'Postcode'">

        <textarea class="short_description_box" name="cleanRequest"
            placeholder="Please give a short description of your cleaning needs. i.e Washing dishes, vacuuming throughout..."
            onfocus="this.placeholder = ''"
            onblur="this.placeholder = 'Please give a short description of your cleaning needs. i.e Washing dishes, vacuuming throughout...'"></textarea>
    </form>


    <div class="findcleaner_buttonWrap">
        <button class="findcleaner_button" type="submit" onClick="location.href='mapsAPI.html'">Find me a cleaner
        </button>
    </div>

JAVASCRIPT КОД

function sendMail(contactForm) {
    emailjs.send("gmail", "contact_form", {
            "full_name": contactForm.fullname.value,
            "user_email": contactForm.emailAddress.value,
            "street_address": contactForm.streetAddress.value,
            "town_city": contactForm.townCity.value,
            "user_postcode ": contactForm.postcode.value,
            "clean_request  ": contactForm.cleanRequest.value,
        })
        .then(
            function (response) {
                console.log("success", response);
            },
            function (error) {
                console.log("FAILED", error);
            }
        )
}

Answer 1

В вашей форме код ожидает отправки формы для запуска Email Js. Однако у вас нет кнопки отправки (любого типа) в самой форме, чтобы инициировать отправку. Вместо этого у вас есть кнопка отправки вне формы, которая перенаправляет посетителей на mapsAPI.html.

. Я переместил кнопку отправки в форму, удалил обработчик onclick из кнопки и добавил перенаправление местоположения для успешного завершения. функция электронной почты js.

  <!--SCRIPT FOR EMAILjs-->

    <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/emailjs-com@2.3.2/dist/email.min.js"></script>
    <script type="text/javascript">
        (function () {
            emailjs.init("user_xxxxxxxxxxxxxxxxxxxxx");
        })();
    </script>


    <!--LOCATION FORM-->

    <form class="contact_form" onsubmit="return sendMail(this);">
        <input type="text" name="full_name" class="form_inputs fullName_input" autocomplete="off" placeholder="Full Name"
            onfocus="this.placeholder = ''" onblur="this.placeholder = 'Full Name'">

        <input type="text" name="emailAddress" class="form_inputs emailAddress_input" autocomplete="off"
            placeholder="Email Address" onfocus="this.placeholder = ''" onblur="this.placeholder = 'Email Address'">

        <p class="cleaningLocationTitle">Cleaning Location:</p>

        <input type="text" name="streetAddress" class="form_inputs streetAddress_input" autocomplete="off"
            placeholder="Street Address" onfocus="this.placeholder = ''" onblur="this.placeholder = 'Street Address'"
            required>

        <input type="text" name="townCity" class="form_inputs townCity_input" autocomplete="off" placeholder="Town/City"
            onfocus="this.placeholder = ''" onblur="this.placeholder = 'Town/City'" required>

        <input type="text" name="postcode" class="form_inputs postcode_input" autocomplete="off" placeholder="Postcode"
            onfocus="this.placeholder = ''" onblur="this.placeholder = 'Postcode'">

        <textarea class="short_description_box" name="cleanRequest"
            placeholder="Please give a short description of your cleaning needs. i.e Washing dishes, vacuuming throughout..."
            onfocus="this.placeholder = ''"
            onblur="this.placeholder = 'Please give a short description of your cleaning needs. i.e Washing dishes, vacuuming throughout...'"></textarea>



    <div class="findcleaner_buttonWrap">
        <button class="findcleaner_button" type="submit">Find me a cleaner
        </button>
    </div>

</form>

function sendMail(contactForm) {
    emailjs.send("gmail", "contact_form", {
            "full_name": contactForm.fullname.value,
            "user_email": contactForm.emailAddress.value,
            "street_address": contactForm.streetAddress.value,
            "town_city": contactForm.townCity.value,
            "user_postcode ": contactForm.postcode.value,
            "clean_request  ": contactForm.cleanRequest.value,
        })
        .then(
            function (response) {
                location.href='mapsAPI.html
                console.log("success", response);
            },
            function (error) {
                console.log("FAILED", error);
            }
        )
}