title: Semantic UI onSuccess callback called even when form validation fails
body: <p>When submitting a form, the onSuccess callback is still called even then the validation fails. </p>
  
  <p>Why is it being called when the form is not valid?</p>
  
  <p>Example here: <a href="https://jsfiddle.net/tL5xx6m9/7/" rel="nofollow">https://jsfiddle.net/tL5xx6m9/7/</a></p>
  
  <p>Snippet:</p>
  
  <p>Verbose explanation to satisfy code/text ratio for submission:</p>
  
  <p>In this snippet I have text that gets written when the onSuccess event is called. By clicking submit you will see that the form is not valid, and that the onSuccess text gets written. Under that text is the bool for whether the form is valid or not by calling <code>$(".ui.form").form('is valid')</code>.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>       $(".ui.form").form({
           onSuccess: function(event, fields) {
             SubmitForm(fields);
             event.preventDefault();
           }
         });
  
         //Processes the forms data for a submission
         function SubmitForm(fields) {
         var valid = $(".ui.form").form('is valid');
           $('#successText').html("On Success Called" + "&lt;br&gt; Is Valid: " + valid);
           console.log("Submitting Form");
           console.log(fields);
         }
  
         $('.ui.form').form({
           fields: {
             input1: {
               identifier: 'input1',
               rules: [{
                 type: "empty",
                 prompt: "input1 - This field is required"
               }]
             },
             input2: {
               identifier: 'input2',
               rules: [{
                 type: "empty",
                 prompt: "input2 - This field is required"
               }]
             }
           }
         });</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;
  &lt;link href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.1.8/semantic.min.css" rel="stylesheet"/&gt;
  &lt;script src="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.1.8/semantic.min.js"&gt;&lt;/script&gt;
  
  &lt;form class="ui form attached fluid segment"&gt;
    &lt;div class="field"&gt;
      &lt;input name="input1" type="text" placeholder="input1" id="testRemoveField"&gt;
    &lt;/div&gt;
    &lt;div class="field"&gt;
      &lt;input name="input2" type="text" id="" placeholder="input2"&gt;
    &lt;/div&gt;
    &lt;button class="ui teal button" type="submit"&gt;Submit&lt;/button&gt;
    &lt;div class="ui error message"&gt;&lt;/div&gt;
    &lt;div id="successText"&gt;
    
    &lt;/div&gt;
  &lt;/form&gt;</code></pre>
  </div>
  </div>
  </p>