I made reservation form. I want to send the reservation time by email using date-picker. So I received the reservation information using emailjs, but the time comes differently. I checked the console, there is no problem, but when I check the email, another time is sent. What's wrong with this?
import { React, useRef } from "react";
import { useForm, Controller } from "react-hook-form";
import emailjs from "@emailjs/browser";
import DatePicker from "react-datepicker";
import "react-datepicker/dist/react-datepicker.css";
const Contact = () => {
const form = useRef();
const time = useRef();
const { control } = useForm();
const sendEmail = (e) => {
const info = {
name: form.current["name"].value,
email: form.current["email"].value,
phone: form.current["phone"].value,
message: form.current["message"].value,
size: form.current["size"].value,
time: time.current.props.selected,
};
console.log("log name", form.current["name"].value);
console.log("log email", form.current["email"].value);
console.log("log phone", form.current["phone"].value);
console.log("log message", form.current["message"].value);
console.log("log size", form.current["size"].value);
console.log("log time", time.current.props.selected);
e.preventDefault();
emailjs
.send("serviceID", "templateID", info, "publicKey")
.then(
(result) => {
console.log(result.status, result.text);
},
(error) => {
console.log(error.status, error.text);
}
);
};
return (
<section class="page-section" id="contact">
<div class="container">
<div class="text-center">
<h2 class="section-heading text-uppercase">Reservation</h2>
</div>
<form id="contactForm" ref={form} onSubmit={sendEmail}>
<div class="row align-items-stretch mb-5">
<div class="col-md-6">
<div class="form-group">
<Controller
control={control}
name="time"
id="time"
render={({ field }) => (
<DatePicker
placeholderText="Select date"
onChange={(date) => field.onChange(date)}
selected={field.value}
showTimeSelect
dateFormat="Pp"
timeFormat="p"
//minDate={new Date()}
minDate={new Date()}
minTime={new Date().setHours(17, 0, 0, 0)}
maxTime={new Date().setHours(21, 0, 0, 0)}
ref={time}
/>
)}
/>
</div>
Web site
Console log
Email, I got different time
