JSFiddle - React, Tailwind, and code Playground

by Rayon Dabre

HTML

<form action=mailpre method="post" enctype="text/plain" autocomplete="on" id="contact">
  <fieldset>
    <legend>Contact Information</legend>
    Name:
    <br>
    <input type="text" name="clientname" autofocus required>
    <br>E-mail:
    <br>
    <input type="email" name="clientemail" required>
    <br>Telephone Number:
    <br>
    <input type="text" name="clientphone">
    <br>
  </fieldset>
  <fieldset>
    <legend>Subject</legend>
    <select id="cusub" name="subject">
      <option value=""></option>
      <option value="booking">Booking An Appointment</option>
      <option value="support">Technical Support</option>
      <option value="feedback">Feedback</option>
    </select>
    <br>
    <textarea name="message" rows="10" cols="30"></textarea>
    <br>
    <input type="submit" value="Send">
  </fieldset>
</form>

JavaScript

var setActionValue = function(value) {
  var mailpre = ("MAILTO:" + value + "@cmputers.ca");
  document.getElementById('contact').action = mailpre;
  alert(document.getElementById('contact').action);
};
document.getElementById('cusub').addEventListener('change', function() {
  setActionValue(this.value);
});
setActionValue(document.getElementById('cusub').value);