Thread

I am testing out the Email Contact Form for a new website and have some questions.  I need to add several fields in addition to the standard set of To/From/Subject/Message.  I defined two <input type name=“required[]”> fields and that worked fine—the data is included at the top of the body of the message.  (BTW, I had no luck using “message[]”) 

Here is the primary problem:  The data is potentially indistinguishable from the receiver’s perspective.  Is there a way to add a label or some text along with what the sender enters - e.g., “Zipcode:”.  (Yes, the data probably will look very different between the additional fields, but that may not always be the case.)

Also, the EE email processor automatically does some error checking for the “standard” fields, e.g., the message field is required and a proper email address must be entered.  Is there a way of specifying that other fields are “required”.  (The “required” value for the “name” would imply that, but it doesn’t seem to work that way.)

Thanks.

And yes, I am aware of Freeform, but I would like to stay with basic EE if possible.

You can add a hidden input as a label…

<input type="hidden" name="message[]" value="---my label---" />
<input type="text" name="message[]" value="" />

When the email is received the text field will have a label above, eg

—-my label—-
Some data

Sweet.  And even sweeter for being so simple.  Thanks.

Now, any solution regarding specifying an added field as “required” and then having the EE email contact form processor forcing a return to the template if the data for a field is omitted?

Hi nroptions,

A user is already forced to click back if their data fails validation on the required fields on your form.
You could use some jQuery validation so the user does not leave the page.

Perhaps I am coding this improperly, but I am not getting the results you describe. I am assuming that if I set name=“required” for zipcode, the field cannot be left blank.  If I need to do further error checking, I will definitely take your advice about jquery.  Interestingly, even though I have done nothing to define the message field as required, leaving it blank is treated as an “error”.  Here is the block of code I am using for testing:

    {exp✉️contact_form user_recipients="false" recipients="*******" charset="utf-8" redirect="4"}

 
  <label for=“from”>Your e-mail address:</label>

  <input type=“text” id=“from” name=“from” size=“60” maxlength=“35” />
 
 
  Name:

  <input type=“text” id=“name” name=“name” size=“60” />
 
  <input type=“hidden” id=“subject” name=“subject” size=“60” value=“Join Our Mailing List” />
 
 
  Zipcode:

  <input type=“text” name=“required” size=“12” /><br >
 
 
  <label for=“message”>Message:</label>

  <textarea id=“message” class=“textarea” name=“message” rows=“18” cols=“60”></textarea>
 
  <input name=“submit” class=“submitButton” type=‘submit’ value=‘Send’ /></p>

  {/exp✉️contact_form}

Try changing required and message values to

<input type=“text” name=“required[]” size=“12” />
<textarea id=“message” class=“textarea” name=“message[]” rows=“18” cols=“60”></textarea>

That does work.  Unfortunately the error message generated is “Email Message is Required”—no distinction between the Zipcode and Message field.  I took a stab at setting id=“zipcode as in

      <input type=“text” id=“zipcode” name=“required[]” size=“12” >

but it had no effect.

Can you try this version?

{exp:email:contact_form user_recipients=“false” recipients=”*******” charset=“utf-8” redirect=“4”}

<input type=“hidden” id=“subject” name=“subject” size=“60” value=“Join Our Mailing List” />

<label for=“from”>Your e-mail address:</label>
<input type=“text” id=“from” name=“from” size=“60” maxlength=“35” />

<label for=“name”>Name:</label>
<input type=“text” id=“name” name=“message[]” size=“60” />

<Label for="zip">Zipcode:</label>
<input type=“text” id="zip" name=“message[]” size=“12” />
 
<label for=“message”>Message:</label>
<textarea id=“message” class=“textarea” name=“message[]” rows=“18” cols=“60”></textarea>
 
<input type=‘submit’ value=‘Send’ />

{/exp:email:contact_form}

How could I not try after all your help.  Unfortunately there is no difference in the error message.

Hi nroptions,

I have been investigating and trying to replicate. It does indeed look buggy specifically the logic of the name attribute used for both required and message. Let me ask the devs on this one and get back to you

Ah… yes, there’s a bit of (understandable) confusion on this one.  The required field doesn’t actually require the field be filled out.  What it does is put the required fields at the top of the email as sort of header-like information.

The only thing that should be triggering that message is a blank message field- that field is required regardless (though you could always make it hidden and stick in a dot or something).

For what you want- truly required fields- you’d want to use some JS validation and/or check out a more comprehensive tool (the contact form is really meant for fairly simple contact forms).  FreeForm is both free and will do exactly what you want- require the required fields be filled out.

That help?  I do realize having a field called ‘required’ is misleading- sorry for the resulting confusion!

Thanks for persevering with the research.  As you suggest, I will look elsewhere for handling validation.

BTW, my tests show that if you add an <input> field to the form other than the standard set of email fields, it is assumed to be part of the message field.  So, leaving the additional field blank will generate an error and report “Email message is required”.

Thanks again for your help.

nroptions,

Glad to see that Robin and John were able to help you out. I’m going to close this thread now, but do feel free to post again when you need more assistance.

Sean