title: @click vue calls form validate in laravel
body: <p>I've got a problem which I cannot explain myself:
  In my Laravel view I include a form as follows</p>
  
  <pre><code>{!! Form::open(array('route' =&gt; ['reports.store', $project-&gt;id], 'data-parsley-validate' =&gt; '','class' =&gt; 'form-horizontal')) !!}
  ... Some &lt;div class="form-group"&gt; ...
  </code></pre>
  
  <p>And then I include within the form my vue</p>
  
  <pre><code>&lt;hirings-form
    :jobs="{{$jobs}}"
    :employees="{{$employees}}"
  &gt;&lt;/hirings-form&gt;
  </code></pre>
  
  <p>In the vue I have the following</p>
  
  <pre><code>&lt;template&gt;
  &lt;div class="container"&gt;
      &lt;div class="row"&gt;
          &lt;table class="table table-responsive table-striped"&gt;
              &lt;thead&gt;
                  &lt;tr&gt;
                      &lt;td&gt;
                          Anstellung
                      &lt;/td&gt;
                      &lt;td&gt;
                          Name
                      &lt;/td&gt;
                      &lt;td&gt;
                          Von
                      &lt;/td&gt;
                      &lt;td&gt;
                          Bis
                      &lt;/td&gt;
                  &lt;/tr&gt;
              &lt;/thead&gt;
  
              &lt;tbody&gt;
                  &lt;tr v-for="row in tableRows"&gt;
                      &lt;td&gt;
                          &lt;select class="form-control" id="workerJob" name="workerJob[]" v-model="jmodel[row]"&gt;
                              &lt;option :value="job.id"
                                  v-for="job in jobs"&gt;{{job.job_title}}&lt;/option&gt;
                              }
                          &lt;/select&gt;
                      &lt;/td&gt;
  
                      &lt;td&gt;
                          &lt;input type="text" class="form-control" id="workerName" name="workerName[]" /&gt;
                      &lt;/td&gt;
  
                      &lt;td&gt;
                          &lt;input type="time" class="form-control" id="workedFrom" name="workedFrom[]" /&gt;
                      &lt;/td&gt;
  
                      &lt;td&gt;
                        &lt;input type="time" class="form-control"
                         id="workedTill" name="workedTill[]" /&gt;
                      &lt;/td&gt;
                  &lt;/tr&gt;
              &lt;/tbody&gt;
          &lt;/table&gt;
  
          &lt;button class="btn btn-primary" @click='addTableRow()'&gt;
            &lt;i class="fa fa-plus"&gt;&lt;/i&gt;
          &lt;/button&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/template&gt;
  
  &lt;script&gt;
    export default {
      props: [
          'jobs',
          'employees',
      ],
      data() {
          return {
              jmodel: [],
              tableRows: [0],
              counter: 0,
          }
      },
  
      methods: {
          addTableRow: function() {
              this.counter += 1;
              this.tableRows.push(this.counter);
              console.log(this.tableRows);
              return false;
          }
       }
    }
  &lt;/script&gt;
  </code></pre>
  
  <p>So what are am I trying to do? I want that table in my vue starting with one row, where I can select the employees job, add the employees name etc. 
  If there is another employee needs to be added, I can click on the plus button and a new row is added. That works perfectly, but laravel's standard form-validator is checking the fields. For testing purposes I deactivated the validator, so if I am clicking the add/plus button the form will be send. Why that? I have that send button on the very end of the form:</p>
  
  <pre><code>{{ Form::submit('Erstellen', array('class' =&gt; 'btn btn-success')) }}
  </code></pre>
  
  <p>before I do</p>
  
  <pre><code>{!! Form::close() !!}
  </code></pre>
  
  <p>Why is Laravel sending my form when pressing the add/plus button? Btw. the submit button works as expected.</p>
  
  <p>Does anyone has a clue?
  Thanks in advance.</p>