Follow

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use
Contact

Getting the value of a subject field on contact form submission

using web3forms for a simple contact form on an HTML page. I was wondering if there was a way to when the user submits the form, instead of having it say "New Submission from Web3Forms" instead have it be the subject of the input in the form. Submission is just coming back with the function name and not the actual value. Is that possible to do? THnaks

Here’s the form block code

<div class="col-lg-8">
  <div class="custom-form">
    <div id="message"></div>
    <form action="https://api.web3forms.com/submit" method="POST" id="form">
      <input type="hidden" name="access_key" value="yourkeyhere" />
      <input type="hidden" name="subject" value="getSubjectValue()" />
      <input type="hidden" name="redirect" value="https://web3forms.com/success" />
      <input type="checkbox" name="botcheck" id="" style="display: none;" />
      <div class="row">
        <div class="col-lg-6">
          <div class="form-group">
            <input name="name" id="name" type="text" class="form-control" placeholder="Your name..." required>
          </div>
        </div>
        <div class="col-lg-6">
          <div class="form-group">
            <input name="email" id="email" type="email" class="form-control" placeholder="Your email..." required>
          </div>
        </div>
      </div>

      <div class="row">
        <div class="col-lg-12">
          <div class="form-group">
            <input name="text" id="subject" type="text" class="form-control" placeholder="Your subject..." required>
          </div>
        </div>
      </div>

      <div class="row">
        <div class="col-lg-12">
          <div class="form-group">
            <textarea name="comments" id="message" rows="4" class="form-control" placeholder="Your message..." required></textarea>
          </div>
        </div>
      </div>

      <input type="submit" id="submit" name="send" class="submitBnt btn btn-custom" value="Send Message">
      <div id="simple-msg"></div>
  </div>
</div>
</form>

I tried doing something like (in a script tag block)

MEDevel.com: Open-source for Healthcare and Education

Collecting and validating open-source software for healthcare, education, enterprise, development, medical imaging, medical records, and digital pathology.

Visit Medevel

function getSubjectValue () {
    const subject = document.getElementById('subject')
    const subjVal = subject.value
}

Thanks for the help

>Solution :

I would delete <input type="hidden" name="subject" value="getSubjectValue()" />
and script block and modify the following code:

<!--from-->
<input name="text" id="subject" type="text" class="form-control" placeholder="Your subject..." required> 
<!--to -->
<input name="subject" id="subject" type="text" class="form-control" placeholder="Your subject..." required>

This would automatically send the subject as a value without a need for an extra input field.
If you really need an extra field, then another way would be to use onChange on the field to change the hidden fields value but this is simpler imho.

Add a comment

Leave a Reply

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use

Discover more from Dev solutions

Subscribe now to keep reading and get access to the full archive.

Continue reading