title: Bootstrap 3 form modal, using PHP, validation
body: <p>I'm trying to use the Bootstrap 3 modal function. I created a simple form within the modal. 
  <img src="https://i.stack.imgur.com/Aygzl.png" alt="enter image description here"></p>
  
  <p>My aim is that the form is processed with PHP, wich I managed with the following script:</p>
  
  <pre><code>$(function() {
      $("button#submit").click(function() {
          $.ajax({
              type: "POST",
              url: "process.php",
              data: $('form.company').serialize(),
              success: function(response) {
                  var result = jQuery.parseJSON(response);
                  /* TO DO */
                  if (result.success === 0) {
                      $("#error").html(response);
                      $("#error").show();
                  } else {
                      $("#success").html(response);
                      $("#success").show();
                      $("#myModal").modal('hide');
                  }
              },
              error: function() {
                  alert("failure");
              }
          });
      });
  });
  </code></pre>
  
  <p>This is working quite good, I'm able to add the new created company to the database and so on. The input is checked server-side and if it is not okay, the user gets an error (currently not fully implemented, but the idea is working). The problem is, I would like to show to the user that some fields are not okay, instead of just a global error message (<code>#error</code>). </p>
  
  <p>I found out that jQuery has a form validation option, but I can't get it working for some reason. And last but not least, I would like to create a multilanguage application. So, another problem is that I should be able to change the error messages produced by the jQuery validation method. (I would like to pass those messages from my process.php script).</p>
  
  <p>Here is the code of the form:</p>
  
  <pre><code>&lt;form class="form-horizontal company" role="form" id="comp"&gt;
                      &lt;div class="form-group"&gt;
                          &lt;label for="name" class="col-sm-2 control-label"&gt;Name&lt;/label&gt;
                          &lt;div class="col-sm-10"&gt;
                              &lt;input type="text" class="form-control" id="name" name="name" placeholder="Company"&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                      &lt;div class="form-group"&gt;
                          &lt;label for="street" class="col-sm-2 control-label"&gt;Street&lt;/label&gt;
                          &lt;div class="col-sm-10"&gt;
                              &lt;input type="text" class="form-control" id="street" name="street" placeholder="Street"&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                      &lt;div class="form-group"&gt;
                          &lt;label for="number" class="col-sm-2 control-label"&gt;Number&lt;/label&gt;
                          &lt;div class="col-sm-10"&gt;
                              &lt;input type="text" class="form-control" id="number" name="number" placeholder="Number"&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                      &lt;div class="form-group"&gt;
                          &lt;label for="zipcode"  class="col-sm-2 control-label"&gt;ZIP Code&lt;/label&gt;
                          &lt;div class="col-sm-10"&gt;
                              &lt;input type="text" class="form-control" id="zipcode" name="zipcode" placeholder="ZIP Code"&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                      &lt;div class="form-group"&gt;
                          &lt;label for="city" class="col-sm-2 control-label"&gt;City&lt;/label&gt;
                          &lt;div class="col-sm-10"&gt;
                              &lt;input type="text" class="form-control" id="city" name="city" placeholder="City"&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                      &lt;div class="form-group"&gt;
                          &lt;label for="country" class="col-sm-2 control-label"&gt;Country&lt;/label&gt;
                          &lt;div class="col-sm-10"&gt;
                              &lt;input type="text" class="form-control" id="country" name="country" placeholder="Country"&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                  &lt;/form&gt;
  </code></pre>
  
  <p>This is the script that I tried for the validation: <a href="http://jsfiddle.net/v5HQr/1/" rel="nofollow noreferrer">http://jsfiddle.net/v5HQr/1/</a></p>
  
  <p>Someone could advise me?</p>