how to send only one value of mail to backend if there are multiple inputs to axios post

Viewed 69

Here I have 3 inputs of mail, if an user wants to fill any 1 input with his input , then only that particular input which will be filled by the user should be sent to the backend. pls help!:)

const App =() => {
  const [email,setEmail]=useState("");
  const [emailEA,setEmailEA]=useState("");
  const [emailFoo,setEmailFoo]=useState("");

  const submitEmail={
    Axios.post("http://localhost:3001/",{email,emailEA,emailFoo})
  }
  return (
    <div className="App">
      <Navbar/>
      <Banner/>
      <input 
        className="email"
        value={email} 
        onChange={(e)=>{
            setEmail(e.target.value)
        }}
        placeholder="Your email address"
      />  
      <TailorMadeServices/>
      <WhyUs/>
      <Testimonial/>
      <Hearit/>
      <EarlyAcc/>
      <input 
        value={emailEA}
        placeholder="Your Email Address"  
        onChange={(e)=>{
          setEmailEA(e.target.value)
        }}
        className="eainput1"
      />
      <Footer/>
      <input 
        className="fmail"
        placeholder="Your Email Address"
        value={emailFoo}
        onChange={(e)=>
          {
          setEmailFoo(e.target.value)
        }
      }
        />
    </div>
  );
1 Answers

Use this code in submitEmail function.

// test values
const email = 'email@test.com'
const emailFoo = ''
const emailEA = 'emailEA@test.com'

const emails_to_send = {email, emailFoo  ,emailEA}
for(const email in emails_to_send){
  if(!emails_to_send[email].match(/^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:\.[a-zA-Z0-9-]+)*$/g)) delete emails_to_send[email]
}
//     Axios.post("http://localhost:3001/",emails_to_send)
console.log(emails_to_send)

Note: Uncomment the axios.post line while using this code.

Note: Although the code works properly , I think that sending unfilled emails to backend shouldn't be a problem.

Related