Problem with receiving user input and sending input to email with email.js

Forums How to solve Problem with receiving user input and sending input to email with email.js

Viewing 1 post (of 1 total)
  • Author
    Posts
  • #1197
    Acenollari
    Participant

    I just tried to integrate mail.js to my project made with nuxt.js, everything went well until the moment when in the script I didn’t get one of the fields filled with text.
    //————————————- JAVASCRIPT FUNCTION ——————————————-

    sendEmail() {
    try {
    emailjs.sendForm(
    “my_service_id_from_mailjs”,
    “my_template_from_mail_js”,
    this.$refs.form.$el,
    “my_private_key_from_mailjs”,
    {
    name: this.name,
    email: this.email,
    telephone: this.telephone,
    subject: this.subject,
    message: this.message,
    }
    );
    alert(“EMAIL SENT SUCCESSFULLY”);
    } catch (err) {
    if (err instanceof ReferenceError) {
    alert(“JSON Error: ” + err.message);
    } else {
    throw err; // rethrow
    }
    }

    //boshojm pasi te behet send
    this.name = “”;
    this.email = “”;
    this.telephone = “”;
    this.message = “”;
    this.subject = “”;
    },

    //—————————————- PROBLEM —————————————–

    Since the structure of the web was divided into 2 columns
    I entered only one column in the form, and the fields that were to be filled in by the other column were not part of this form. When I sent the email from the web, I received only the data entered in the form. So I first created the form and then divided it into columns, so the function managed to capture all the data I needed just like this:

    <v-form
    @submit.prevent=”sendEmail”
    ref=”form”
    :lazy-validation=”lazy”
    >
    <v-row justify=”center”>
    <v-col cols=”12″ sm=”7″>
    <v-text-field
    class=”text-field-padding”
    v-model=”name”
    :rules=”nameRules”
    label=”Name”
    name=”name”
    solo
    required
    ></v-text-field>

    <v-text-field
    class=”text-field-padding”
    v-model=”email”
    :rules=”emailRules”
    name=”email”
    solo
    label=”E-mail”
    required
    ></v-text-field>

    <v-text-field
    class=”text-field-padding”
    v-model=”telephone”
    name=”telephone”
    :rules=”phoneRules”
    solo
    label=”Telephone”
    required
    ></v-text-field>

    <v-text-field
    class=”text-field-padding”
    v-model=”subject”
    name=”subject”
    :rules=”textAreaRules”
    label=”Subject”
    required
    solo
    ></v-text-field>
    </v-col>

    <v-col cols=”12″ sm=”5″>
    <v-textarea
    class=”text-field-padding”
    name=”message”
    v-model=”message”
    solo
    :rules=”textAreaRules”
    label=”Your message”
    />

    <!– <v-file-input
    accept=”image/*”
    label=”File input”
    ></v-file-input> –>

    <v-btn
    color=”primary”
    :dark=”valid”
    block
    class=”mt-3″
    @click=”sendEmail”
    >
    Submit
    </v-btn>

    <h1 class=”font-weight-light font-color text-style display-1″>
    FINNET CONSULTING LTD
    </h1>

    <h3 @click=”openMap()” style=”cursor: pointer;” class=”font-weight-light mt-3 text-style font-color”>
    London, United Kingdom
    </h3>

    <h3 @click=”openWeb()”  style=”cursor: pointer;” class=”font-weight-light mt-3 text-style font-color”>
    http://www.finnetconsulting.co.uk
    </h3>

    <h3 @click=”writeEmail()”  style=”cursor: pointer;”  class=”font-weight-light text-style font-color”>
    Email: info@finnetconsulting.co.uk
    </h3>
    </v-col>
    </v-row>
    </v-form>

Viewing 1 post (of 1 total)
  • You must be logged in to reply to this topic.