Required field no longer validating

62 Posts

jhewak Reply #1, 10 years, 11 months ago

The form below, located at http://www.breakawaydistributing.com/products/t-shirts/adult-baseball-t-shirt-5540.html, allows submissions without an email address. Ie, the required fields are not being required. This used to work. I don't think i made any changes to the site. Can anyone see the problem? I've tried a number of things.

It's formit 2.0.3. Modx 2.2.0.

<div id="productForm">


  <p>[[!FormIt? &hooks=`email, formSuccess, redirect,FormItAutoResponder` &emailTpl=`sentEmailQuoteTpl` &emailSubject=`Online Quotation RE:  [[*pagetitle]]`  &emailFrom=`[email protected]` &emailFromName=`Breakaway Distributing` &emailTo=`[email protected]` &validate=`color:required, contact_name:required:minLength=`2`, contact_email:email:required, contact_message:required` &redirectTo=`[[~[[*id]]]]` &fiarTpl=`autoResponseToQuoteRequestTpl` &fiarSubject=`Quote request RE: [[*pagetitle]]`  &fiarToField=`contact_email`   &fiarFrom= `[email protected]` &fiarFromName=`Breakaway Distributing` &validate=`workemail:blank`]]</p>
  <p>Please fill out the form below to receive an email quote within one business day:<br />
    [[+placeholder]] </p>
  <form id="contactForm" class="cmxform" action="[[~[[*id]]]]" method="post" enctype="multipart/form-data">
    <div>
      <label for="color">Colour </label>
      <em>(required)</em> <b>Note:</b> Computer monitors render colours differently. If you have a particular <br />colour in mind, be sure to call and ask for a colour swatch.  <br />
      <input id="color" class="required" type="text" name="color" value="[[!+fi.color]]" size="15" maxlength="30" />
    </div>
    <div>Size <br />
      <table width="60%" border="0" cellspacing="1" cellpadding="1">
        <tbody>
          <tr>
            <td><label for="S">S<br />
              </label>
              <input id="S" type="text" name="S" value="[[!+fi.S]]" size="2" maxlength="4" /></td>
            <td><label for="M">M<br />
              </label>
              <input id="M" type="text" name="M" value="[[!+fi.M]]" size="2" maxlength="4" /></td>
            <td><label for="L">L<br />
              </label>
              <input id="L" type="text" name="L" value="[[!+fi.L]]" size="2" maxlength="4" /></td>
            <td><label for="XL">XL<br />
              </label>
              <input id="XL" type="text" name="XL" value="[[!+fi.XL]]" size="2" maxlength="4" /></td>
            <td><label for="2XL">2XL<br />
              </label>
              <input id="2XL" type="text" name="2XL" value="[[!+fi.2XL]]" size="2" maxlength="4" /></td>
            <td><label for="3XL">3XL<br />
              </label>
              <input id="3XL" type="text" name="3XL" value="[[!+fi.3XL]]" size="2" maxlength="4" /></td>
          </tr>
        </tbody>
      </table>
    </div>
    <div>
      <p>
        <label for="screen">Screen Printing </label>
        <img class="alignleft" src="assets/images/t-shirt_front.jpg" alt="shirt" width="186" height="176" />
        <input id="screen" type="checkbox" name="screen" value="[[!+fi.screen]]" size="30" />
        <label><br />
          Front <br />
          <select id="front" name="front" size="1">
            <option value="0">No colours</option>
            <option value="1">1 colour</option>
            <option value="2">2 colour</option>
            <option value="3">3 colour</option>
            <option value="4">4 colour</option>
            <option value="5">5 colour</option>
            <option value="6">6 colour</option>
            <option value="7">7 colour</option>
            <option value="8">8 colour</option>
          </select>
        </label>
        <label><br />
          Back<br />
          <select id="back" name="back" size="1">
            <option value="0">No colours</option>
            <option value="1">1 colour</option>
            <option value="2">2 colour</option>
            <option value="3">3 colour</option>
            <option value="4">4 colour</option>
            <option value="5">5 colour</option>
            <option value="6">6 colour</option>
            <option value="7">7 colour</option>
            <option value="8">8 colour</option>
          </select>
          <br />
        </label>
        <label>Left Sleeve<br />
          <select id="leftsleeve" name="leftsleeve" size="1">
            <option value="0">No colours</option>
            <option value="1">1 colour</option>
            <option value="2">2 colour</option>
            <option value="3">3 colour</option>
            <option value="4">4 colour</option>
            <option value="5">5 colour</option>
            <option value="6">6 colour</option>
            <option value="7">7 colour</option>
            <option value="8">8 colour</option>
          </select>
          <br />
        </label>
        <label>Right Sleeve <br />
          <select id="rightsleeve" name="rightsleeve" size="1">
            <option value="0">No colours</option>
            <option value="1">1 colour</option>
            <option value="2">2 colour</option>
            <option value="3">3 colour</option>
            <option value="4">4 colour</option>
            <option value="5">5 colour</option>
            <option value="6">6 colour</option>
            <option value="7">7 colour</option>
            <option value="8">8 colour</option>
          </select>
        </label>
      </p>
      <p> </p>
      <label for="embroidery">Embroidery</label>
      <input id="embroidery" type="checkbox" name="embroidery" value="[[!+fi.embroidery]]" size="30" />
      <label> </label>
      <label> </label>
      <label>Embroidery Locations
        <select id="embroiderylocations" name="embroiderylocations">
          <option value="0">No locations</option>
          <option value="1">1 location</option>
          <option value="2">2 locations</option>
          <option value="3">3 locations</option>
          <option value="4">4 locations</option>
        </select>
      </label>
      <br />
      <div>
        <label for="contact_name">Name </label>
        <em>(required, at least 2 characters)</em><br />
        <input id="contact_name" class="required" type="text" name="contact_name" value="[[!+fi.contact_name]]" size="30" />
      </div>
      <div>
        <label for="contact_email">E-Mail </label>
        <em>(required)</em><br />
        <input id="contact_email" class="required email" type="text" name="contact_email" value="[[!+fi.contact_email]]" size="30" />
      </div>
      <div>
        <label for="contact_phone_NA_format">Phone </label>
        <em>(optional)</em><br />
        <input id="contact_phone_NA_format" class="phone" type="text" name="contact_phone_NA_format" value="[[!+fi.contact_phone_NA_format]]" size="14" maxlength="14" />
        <label for="contact_ext_NA_format">ext. </label>
        <input id="contact_ext_NA_format" class="ext" type="text" name="contact_ext_NA_format" value="[[!+fi.contact_ext_NA_format]]" size="5" maxlength="5" />
      </div>
      <div>
        <label for="contact_attachment">Attach a File </label>
        <em>(optional<em> - max file size 5MB</em>)</em><br />
        <input id="contact_attachment" type="file" name="contact_attachment" value="[[!+fi.contact_attachment]]" />
      </div>
      <div>
        <label for="contact_message">Your comment </label>
        <em>(required)</em><br />
        <textarea id="contact_message" class="required" name="contact_message" rows="7" cols="40">[[!+fi.contact_message]]</textarea>
<input type="hidden" name="workemail" value="" />

      </div>
      <div>
        <input class="submit" type="submit" name="submit" value="Submit" />
      </div>
    </div>
  </form>
</div>

195 Posts

diatomin Reply #2, 10 years, 11 months ago

contact_name:required:minLength=`2` <-- according to the docs, there are quotes are '^' symbols instead of '`'. That might be the problem?

http://rtfm.modx.com/display/ADDON/FormIt.Validators [ed. note: diatomin last edited this post 10 years, 11 months ago.]

62 Posts

jhewak Reply #3, 10 years, 11 months ago

They are back ticks. I thought that's what I'm supposed to use.

Quote from: diatomin at May 25, 2013, 02:27 AM

contact_name:required:minLength=`2` <-- according to the docs, there are quotes are '^' symbols instead of '`'. That might be the problem?

http://rtfm.modx.com/display/ADDON/FormIt.Validators

62 Posts

jhewak Reply #4, 9 years, 10 months ago

Hi People, really could use some support with this situation. I can't get the form to validate. What am I doing wrong? Please anyone?

☆ A M B ☆
24,524 Posts

sottwell Reply #5, 9 years, 10 months ago

<p>[[!FormIt? &hooks=`email, formSuccess, redirect,FormItAutoResponder` &emailTpl=`sentEmailQuoteTpl` &emailSubject=`Online Quotation RE:  [[*pagetitle]]`  &emailFrom=`[email protected]` &emailFromName=`Breakaway Distributing` &emailTo=`[email protected]` &validate=`color:required, contact_name:required:minLength=`2`, contact_email:email:required, contact_message:required` &redirectTo=`[[~[[*id]]]]` &fiarTpl=`autoResponseToQuoteRequestTpl` &fiarSubject=`Quote request RE: [[*pagetitle]]`  &fiarToField=`contact_email`   &fiarFrom= `[email protected]` &fiarFromName=`Breakaway Distributing` &validate=`workemail:blank`]]</p>

Hard to wade through in this form. Try opening it out to look more like this

[[!FormIt? 
  &hooks=`email,formSuccess,redirect,FormItAutoResponder` 
  &emailTpl=`sentEmailQuoteTpl` 
  &emailSubject=`Online Quotation RE:  [[*pagetitle]]`  
  &emailFrom=`[email protected]` 
  &emailFromName=`Breakaway Distributing` 
  &emailTo=`[email protected]` 
  &validate=`color:required, 
  	contact_name:required:minLength=`2`, 
	contact_email:email:required, 
	contact_message:required`,
	workemail:blank
  &redirectTo=`[[~[[*id]]]]`
  &fiarTpl=`autoResponseToQuoteRequestTpl`
  &fiarSubject=`Quote request RE: [[*pagetitle]]` 
  &fiarToField=`contact_email`  
  &fiarFrom= `[email protected]`
  &fiarFromName=`Breakaway Distributing`
  &validate=`workemail:blank`
]]

You have two &validate properties there. In my test, that broke your validation. You also have a redirect to the same page, which FormIt will do anyway, so that's a bit redundant, and slows things down. You also have no visible error indicators, no messages, no nothing. You could at least put in something so the user will know he's done something wrong.

[[!+fi.validation_error_message:notempty=`<p>[[!+fi.validation_error_message]]</p>`]]

Studying MODX in the desert - http://sottwell.com
Tips and Tricks from the MODX Forums and Slack Channels - http://modxcookbook.com
Join the Slack Community - http://modx.org