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

[Acenollari]

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>

[Author]

Posts