title: jQuery max value of fields and min in form
body: <p>I'm little bit new with jQuery so I have some questions:</p>
  
  <p>I have a form with 2 links where you can add 1 field and remove 1 field.</p>
  
  <ol>
  <li><p>But the problem is I want to stop at 10 fields, so you max can add 10 fields?</p></li>
  <li><p>The second problem is how can it stop at minimum 1 field, right now it's deleting every field to 0 if you click remove all the time?</p></li>
  <li><p>Last question how can I do, so when I press submit button, I want to remember how many fields you were on before you pressed submit?</p></li>
  </ol>
  
  <p>I hope somebody can help me, it's something i need really quick :-D</p>
  
  <p>jQuery:</p>
  
  <pre><code>var i = $('input').size() + 1;
  max = 10;
  
  $('#add').click(function() {
      $('&lt;div&gt;&lt;input type="text" class="field" name="dynamic[]" value="Some text..." /&gt;&lt;/div&gt;').fadeIn('slow').appendTo('.inputs');
      i++;
  });
  
  $('#remove').click(function() {
  if(i &gt; 1) {
      $('.field:last').remove();
      i--; 
  }
  });
  </code></pre>
  
  <p>HTML:</p>
  
  <pre><code>&lt;a href="#" id="add"&gt;Add +1&lt;/a&gt; | &lt;a href="#" id="remove"&gt;Remove -1&lt;/a&gt;
  &lt;form method="post"&gt;
      &lt;div class="inputs"&gt;
          &lt;div&gt;
              &lt;input type="text" name="dynamic[]" class="field" value="Some text..."/&gt;&lt;/div&gt;
          &lt;/div&gt;
      &lt;input name="submit" type="submit" class="submit" value="Submit"/&gt;
  &lt;/form&gt;
  </code></pre>