title: Use foundation abide to validate length of a text field?
body: <p>I'm using foundation in a rails app and I'm looking for a way to validate the length of text fields in a form: I'd like to display an error when the text field contains too many characters (but not when it's empty).</p>
  
  <p>I tried to use Foundation's abide and create custom named patterns as explained in the <a href="http://foundation.zurb.com/docs/components/abide.html" rel="nofollow">docs</a>.</p>
  
  <p>Here are the contents of my <code>application.js</code> file including the custom patterns upon Foundation initialization:</p>
  
  <pre><code>$(function(){ 
    $(document)
      .foundation()
      .foundation('abide', {
        patterns: {
          short_field: /^.{,40}$/,
          long_field: /^.{,72}$/
        }
      }); 
  });
  </code></pre>
  
  <p>And here is my form code in the view:</p>
  
  <pre><code>&lt;form data-abide&gt;
    &lt;div class="long-name-field"&gt;
      &lt;input type="text" pattern="long_field" placeholder="Long Field"&gt;
      &lt;small class="error"&gt;Too long.&lt;/small&gt;
    &lt;/div&gt;
    &lt;div class="short-name-field"&gt;
      &lt;input type="text" pattern="short_field" placeholder="Short Field"&gt;
      &lt;small class="error"&gt;Too long.&lt;/small&gt;
    &lt;/div&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p>The problem is that when I load my form page all the fields always display the error message, whether they're empty, filled under their character limit or exceeding their character limit.</p>
  
  <p>Anyone successfully used abide to do something similar (or knows a better way that is not using custom named patterns)?</p>
  
  <p>Cheers.</p>